mu-vue-plugin

mu-vue-plugin
1,196
Install
npm install mu-vue-plugin@1.0.0
Latest Version:1.0.0
Vue:2
Last Updated:May 8, 2019
Links: npm
Maintainer: sonyaliu

mu-vue-plugin

mu-vue-plugin

安装启动

# install dependencies
npm install

# serve with hot reload at localhost:8080
npm run start

# build for production and publish
npm run pub

使用方式

  1. 安装插件
npm install mu-vue-plugin
  1. 在项目中引入，main.js文件中添加
import muVuePlugin from 'mu-vue-plugin'
Vue.use(muVuePlugin)

一、 文件上传至七牛云插件

使用示例：

<mu-upload-file
  ref="muUpload"
  :upload-params="uploadParams"
  :style-name="uploadOption.styleName"
  :auto-upload="uploadOption.autoUpload"
  :limit="uploadOption.limit"
  :max-size="uploadOption.maxSize"
  :show-file-list="uploadOption.showFileList"
  @tokenError="tokenError"
  @uploadSuccess="uploadSuccess"
  @uploadError="uploadError"
  @deleteSuccess="deleteSuccess"></mu-upload-file>

参数说明：

参数名 说明 类型 是否必填 可选值 默认值
upload-params 上传文件所需的token和domain Object 是 - {"token": "EMKHAX8lWY7alVKPuitIWS4IisNMZBGRTjS36aOH:","domain": "https://qnoutbucket.immatchu.com/"}
style-name 上传按钮类型 String 否 btn-style, picture-style btn-style
auto-upload 选择文件后是否自动上传 Boolean 否 - false
file-type 文件类型限制 String 否 picture, excel, word, pdf, video -
limit 一次上传文件个数限制 Number 否 - 1
max-size 上传的每个文件最大体积，单位为KB String 否 - 4000
show-file-list 是否显示上传的文件列表 Boolean 否 - true

函数参数说明：

参数 说明 回调参数类型 回调参数示例
tokenError 缺少上传使用的token参数或token已失效 String token不可用
uploadSuccess 文件上传成功回调，参数是上传成功的文件信息 Array [{"url": "https://qnoutbucket.immatchu.com/2019_4_11_98086e9a-9bf8-4752-91ea-8d49a4b412da.jpg", "uniqueName": "2019_4_11_98086e9a-9bf8-4752-91ea-8d49a4b412da.jpg", "size":"10014"}]
uploadError 文件上传失败回调，参数是失败原因 String 文件大小超过限制，上传失败
deleteSuccess 文件删除回调，参数是已经删除的文件链接 String https://qnoutbucket.immatchu.com/2019_4_11_98086e9a-9bf8-4752-91ea-8d49a4b412da.jpg

方法说明：

方法名 说明 传参
startUpload 手动开始对已经选择文件列表进行上传操作 -
deleteFile 删除指定文件 文件url

Version History

Version Released Vue License
1.0.0 ^2.5.2
0.2.8 ^2.5.2
0.2.7 ^2.5.2
0.2.6 ^2.5.2
0.2.5 ^2.5.2