Vuppy

Simple unofficial Vue.js wrapper for popular library https://uppy.io/

🚀 DEMO

https://vuppy.netlify.com/

Instalation

• npm npm install vuppy
• yarn yarn add uppy

Usage

<template>
    <vuppy v-model="images"></vuppy>
</template>
 
<script>
import vuppy from 'vuppy';
 
export default {
    components: {
        vuppy
    },
 
    data() {
        return {
            images: []
        }
    }
}
</script> 

Image object

{
    id: Uppy generated id
    file: base64 hashed file,
    name: original filename,
}

Options

You can specify following properties

Name	Type	Default value	Description
id	String	uppy	When there is more than just one instance rendered at the same time you need to specify uniq id
maxFileSize	Number	2000000	Specify Max file size (Bytes)
allowedFileTypes	Array	null	Array of allowed file types. Exact mime types image/jpeg, or file extensions ['image/*', '.jpg', '.jpeg', '.png', '.gif']
maxNumberOfFiles	Number	null	Maximum namuber of files
minNumberOfFiles	Number	null	Minimum namuber of files
dashboardHeight	Number	null	Dashboard height
dashboardWidth	Number	null	Dashboard width
theme	String	light	Dashboard color theme
locale	String	en_US	All available locales can be found here

License

The MIT License.