el-upload的使用方法

基本使用方法
el-upload的基本使用方法很简单，参考官网即可，这里记录几个常用的属性

<el-col :span="12">
   <el-form-item label="附件" prop="attachments">
     <el-upload
       class="upload"
       name="file"
       :action="doUpload"
       :headers="headers"
       :before-remove="beforeRemove"
       :limit="5"
       :on-exceed="handleExceed"
       :before-upload="handleBeforeUpload"
       :on-success="uploadSuccess"
       :multiple="true"
       :file-list="fileList"
     >
       <el-button type="text" size="small" icon="el-icon-upload">点击上传</el-button>
     </el-upload>
   </el-form-item>
 </el-col>

• class：可以自己修改一下样式
• name：这个name很重要，错了后台接收不到文件，官方是这样解释的 上传的文件字段名 ,实际上就是后端对应的接口参数的名字，后端可能是这么定义的 public AjaxResult uploadFile(MultipartFile file) throws Exception
• action：就是后端接收文件的接口地址
• headers：有些程序用token作为鉴权依据，通常把token放在header中，headers长这样子：headers:
• beforeRemove：删除之前可以弹出个提示框，问问要不要删除，就像这样 ： return this.$confirm(确定移除 ${file.name}？)
• on-exceed：官方这么解释文件超出个数限制时的钩子 ,一般应用这个钩子弹出一个提示信息，告诉用户文件个数超过限制了
• before-upload：官方这么解释上传文件之前的钩子，参数为上传的文件，若返回 false 或者返回 Promise 且被 reject，则停止上传。 我们可以在上传之前判断一下用户选择的文件是不是符合要求，比如文件类型是否正确、文件大小是否超限等。例如：

// const isLtSize = file.size / 1024 / 1024 < this.acceptSize
        // this.isLtSize = file.size / 1024 / 1024 < this.acceptSize
        // if (!this. isLtSize) {
        //   if (this.listType === "picture-card" || this.listType === "picture") {
        //     this.$message.error('上传图片大小不能超过 ' + this.acceptSize + 'MB!')
        //   } else {
        //     this.$message.error('上传附件大小不能超过 ' + this.acceptSize + 'MB!')
        //   }
        // }
        // return this.isLtSize

        let _this = this
        _this.isSpecif(file)

        _this.isLtSize = true
        let i = file.type.indexOf('/')
        // let fileName = file.type.substring(i, file.type.length)
        // if(fileName !== 'pdf' && fileName !== 'msword' && fileName !== 'vnd.openxmlformats-officedocument.wordprocessingml.document' && fileName !== 'vnd.openxmlformats-officedocument.spreadsheetml.sheet' && fileName !== 'x-zip-compressed') {
        let extName = file.name.substring(file.name.lastIndexOf('.')).toLowerCase()
        if (_this.accept.indexOf(extName) === -1) {
          _this.$message({
            message: '请上传规定的文件格式',
            type: 'error'
          })
          _this.isLtSize = false
          return false
        }
        if(file.size/1024/1024 >= _this.acceptSize) {

          if (_this.acceptSize < 1024) {
            _this.$message.error('上传附件大小不能超过 ' + _this.acceptSize + 'MB !')
          } else {
            let size = (_this.acceptSize / 1024).toPrecision(2) + 'G'
            _this.$message.error('上传附件大小不能超过 ' + size + ' !')
          }

          _this.isLtSize = false
          return false
        }

• multiple：是否支持选择多个文件
• file-list：在查看数据的时候，如果我们要回显已经上传的文件，就需要设置这个属性了

fileList = [{name:"1.png",
fileName:"/admin.1.png"},
{name:"新建文本文档.txt",
fileName:"/admin/2.txt"}]