UNPKG

@58fe/p5

Version:

pc端vue组件

77 lines (56 loc) 2.49 kB
<script> module.exports = { data() { return{ withCredentails: true } } } </script> ## Upload 上传 ### 引入 ```javascript import { upload } from '@58fe/p5'; ``` ### 基本用法 :::demo ```html <upload action="http://apimanage.58corp.com/mock/5d11ba6dc8659502950970be"></upload> ``` ::: ### 多文件上传 :::demo ```html <upload action="http://apimanage.58corp.com/mock/5d11ba6dc8659502950970be" :with-credentails=withCredentails :multiple=true></upload> ``` ::: ### 拖拽上传 拖拽上传默认支持多文件形式 :::demo ```html <upload action="http://apimanage.58corp.com/mock/5d11ba6dc8659502950970be" uploadtype='drop'></upload> ``` ::: ### 自定义展示上传列表及进度条 `showUploadList`属性定义是否展示上传文件列表 :::demo ```html <upload action="http://apimanage.58corp.com/mock/5d11ba6dc8659502950970be" :with-credentails=withCredentails :multiple=true :show-upload-list=true></upload> ``` ::: ### 参数 | 参数 | 说明 | 类型 | 可选值 | 默认值 | | ------------ | -------------- | ------------------- | ------------ | ------- | | action | 上传地址 | String | 必填项 | '' | | headers | 自定义header | Object | —— | --| | uploadtype | 上传样式类型 | String | select/drop | select | | withCredentails | 是否开启缓存 | Boolean | —— | false | | data | 上传文件时所带数据 | Object | —— | —— | | maxSize | 上传文件的大小限制,单位kb | Number | —— | —— | | multiple | 是否要多文件传输 | Boolean | true/false | false | | showUploadList | 是否展示上传列表 | Boolean | true/false | true | | onProgress | 上传进度回调函数,返回参数(e, _file, fileList) | Function | —— | —— | | onSuccess | 上传成功回调函数,返回参数(res, _file, fileList) | Function | —— | —— | | onError | 上传失败回调函数,返回参数(err, response, file) | Function | —— | —— | | onRemove | 删除掉某一上传文件的回调函数,返回参数(file, fileList) | Function | —— | —— | | onExceededSize | 超出限制大小回调函数,返回参数(file, fileList) | Function | —— | —— |