dt-upload

Vue Json upload for Vue.

Installation

NPM

npm install dt-upload

Mount

global

import Vue from 'vue'
import dtUpload from 'dt-upload'

// you can set default global options and events when use
Vue.use(dtUpload)

local

import { upload } from 'dt-upload'

export default {
  components: {
    upload
  }
}

Demo

// 文件上传
<upload v-model="file" :maxCount="1"></upload>

<script>
data() {
  return {
    files: [{ url: '....' }]
  }
}
</script>

api

Attributes

参数 | 说明 | 类型 | 可选值 | 默认值 ------- | -----------------------| -------------- | -------- |------------ value/v-model|绑定值 [{ url: '', name: 'asdsa.png' }] |array|--|-- maxSize |上传文件大小限制 1 = 1MB |number|--|-- accept |上传格式 例 '.jpg, .png, .jif' |string|--|image/* disabled |是否只读 |boolean|--|-- deletable |是否显示删除按钮|boolean|--|-- resultType | 字段表示文件读取结果的类型，上传大文件时，建议使用 file 类型，避免卡顿|string|file 结果仅包含 File 对象,text 结果包含 File 对象，以及文件的文本内容,dataUrl 结果包含 File 对象，以及文件对应的 base64 编码|'dataUrl','text','file'|dataUrl maxCount|最多上传数量|number|--|-- multiple|是否可多选|boolean|--|-- beforeRead|文件上传前的回调 | Function(files：上传的文件)|--|-- afterRead|文件读取完成后的回调函数 | Function(files：上传的文件)|--|-- beforeDelete|删除的回调函数|Function(file: 删除文件, index: 删除文件的索引)|--|--

Event

方法名 | 说明 | 参数
------- | ------- | -------------- oversize|文件读取大小超过限制的回调|files

Methods

方法名 | 说明 |参数
------- | ------- | -------------- onDelete| 删除某个文件 | （files：文件, index：文件索引）