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

2. 在项目中引入，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 |