An open API service indexing awesome lists of open source software.

https://github.com/salemcode8/vue-dropify

Dropify Library for Vue.js
https://github.com/salemcode8/vue-dropify

Last synced: about 1 year ago
JSON representation

Dropify Library for Vue.js

Awesome Lists containing this project

README

          

## vue-dropify

[![npm](https://img.shields.io/npm/v/@salemcode8/vue-dropify.svg)](https://www.npmjs.com/package/@salemcode8/vue-dropify) ![license](https://img.shields.io/github/license/salemcode8/vue-dropify.svg)

## Description

Dropify build for vuejs framework

**vue-dropify** package links :
- npm
- yarn

## Getting Started

_This packages still in Dev mode_
`vue-dropify` helps you to upload files with a simple pre-visual display.

## Installing

```bash
npm i @salemcode8/vue-dropify
```
```bash
yarn add @salemcode8/vue-dropify
```

## Usage

```javascript
import VueDropify from 'vue-dropify';

export default {
components: {
'vue-dropify': VueDropify
}
}
```

## Attributes

| name | default | description |
|---- |---- |---- |
| **_full_** | false | `Boolean // this attribute define if dopify zone is full width` |
| **_size_** | null | `String/Array // [minSize,maxSize] or 'maxSize'` |
| **_unit_** | 'bk' | `String // Options are : ['b'(bytes),'kb'(kilobytes),'mb'(megabytes)] ` |
| **_width_** | 'auto' | `String // Width of dropify zone` |
| **_height_** | '' | `String // Height of dropify zone` |
| **_accept_** | 'image/*' | `String // The same option as ` |
| **_message_** | null | `String // Displayed message when no image is selected` |
| **_multiple_** | null | `Boolean // To enable multiple file upload` |
| **_uploadIcon_** | '' | `String // Icon className` |
| **_removeIcon_** | null | `String // Icon className` |

## Actions

| name | description |
|---- |---- |
| **_@upload_** | trigger when image is selected |
| **_@change_** | when change happen to input file |
| **_@input_** | trigger when change happen to input file (For v-model Directive) |