Vuppy NPM | npm.io

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