goodies-uploader v1.0.5

Goodies-Uploader

GoodiesUploader is an open source library that provides drag’n’drop file uploads.

Installing

Using npm:

$ npm install goodies-uploader

Using jsDelivr CDN:

<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/goodies-uploader@1.0.5/dist/goodies-uploader.css">
<script src="https://cdn.jsdelivr.net/npm/goodies-uploader@1.0.5/dist/goodies-uploader.js"></script>

Using unpkg CDN:

<link rel="stylesheet" href="https://unpkg.com/goodies-uploader@1.0.5/dist/goodies-uploader.css">
<script src="https://unpkg.com/goodies-uploader@1.0.5/dist/goodies-uploader.js"></script>

Example

NOTE: goodies-uploader is now activated and available as window.GoodiesUploader. This is all you need to get goodies-uploader up and running, but if you want it to look like the demo on this page, you’ll need to use the goodies-uploader.css in the dist folder.

<div id="uploader"></div>

import 'goodies-uploader/dist/goodies-uploader';
var uploader = new GoodiesUploader('#uploader', { action: 'http://172.16.2.20:10086/upload/' });

Configuration options

Events

beforeUpload 上传文件之前的钩子，参数为上传的文件，若返回false则停止上传。

uploader.on('beforeUpload', function (file) {
    if (file.name.indexOf('.jpg') === -1 && file.name.indexOf('.png') === -1) {
        console.log('上传文件格式仅支持jpg、png。')
        return false;
    } else {
        return true;
    }
});

success 文件上传成功时的钩子。返回值: { response, file, fileList }

uploader.on('success', function (res) {
    console.log(res);
});

error 文件上传失败时的钩子。返回值: { file, fileList }

uploader.on('error', function (res) {
    console.log(res);
});

Try it Yourself

Demo