Ecosyste.ms: Awesome

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

Awesome Lists | Featured Topics | Projects

https://github.com/etheryte/nuxt-dropzone

A Nuxt SSR-compatible Dropzone component.
https://github.com/etheryte/nuxt-dropzone

dropzone javascript nuxt vue

Last synced: 21 days ago
JSON representation

A Nuxt SSR-compatible Dropzone component.

Awesome Lists containing this project

README

        

# nuxt-dropzone

A Nuxt SSR-compatible [Dropzone](http://www.dropzonejs.com/) component, internally powered by [vue-dropzone](https://github.com/rowanwins/vue-dropzone).

## Installation

npm i --save nuxt-dropzone

## Usage

See [the demo project](https://github.com/Etheryte/nuxt-dropzone/tree/master/demo).

```html

```
```js

import Dropzone from 'nuxt-dropzone'
import 'nuxt-dropzone/dropzone.css'

export default {
components: {
Dropzone
},
data() {
return {
// See https://rowanwins.github.io/vue-dropzone/docs/dist/index.html#/props
options: {
url: "http://httpbin.org/anything"
}
}
},
mounted() {
// Everything is mounted and you can access the dropzone instance
const instance = this.$refs.el.dropzone
}
}

```

See [the vue-dropzone docs](https://rowanwins.github.io/vue-dropzone/docs/dist/index.html#/props) for futher configuration information.

[Direct AWS S3 uploads](https://rowanwins.github.io/vue-dropzone/docs/dist/#/aws-s3-upload) are also supported.

## Common issues and solutions

* [Importing styles doesn't work with PostCSS out-of-the-box](https://github.com/Etheryte/nuxt-dropzone/issues/3)
* [IE support](https://github.com/Etheryte/nuxt-dropzone/issues/17)
* [Scoped styles are not applied](https://github.com/Etheryte/nuxt-dropzone/issues/12)

## Issues & contributing

Please file any issues under [Github issues](https://github.com/Etheryte/nuxt-dropzone/issues), be sure to include your Nuxt release version as well as [a minimal, complete, and verifiable example](https://stackoverflow.com/help/mcve).
Contributions welcome, be sure to test the demo application with any changes before filing a pull request.