Home Posts GitHub Menu

Vue Upload Guides Startup



File uploads is going to be one of the most common features an application will need. The plugin aims to simplify single and multi file uploads.

Features

  • Drag and drop file zone.
  • Progress indicators.
  • Synchronous or asynchronous modes.
  • Validation

Install

Install the package via npm.

> sudo npm install @websanova/vue-upload

Setup

The default install is for ES6 module syntax.

import Vue from 'vue';
import VueUpload from '@websanova/vue-upload';

Vue.use(VueUpload, {
    // options
});

Also supports ES5 require syntax.

var Vue       = require('vue');
var VueUpload = require('@websanova/vue-upload/dist/vue-upload.common.js');

Vue.use(VueUpload, {
    // options
});

HTTP Requests

Note that the driver comes with a simple http wrapper for sending off requests which was built around vue-resource being installed and Vue.http being available.

This may not work with other libraries like Axios out of the box. But the method is quite simple and can be overridden by overriding the http option.

https://github.com/websanova/vue-upload/blob/master/src/upload.js#L53

The line above shows the setup to follow and the request object response should have an abort method available as well.

NOTE: I will eventually get this updated with swappable drivers, so hang tight for now if you got to this point. Or please submit a pull request.