el-upload默认选中文件后直接上传服务器，但是在很多场景中需要我们在这个基础上做一些处理，所以统一整理了下，供参考

1，点击提交按钮上传文件

//一定要关闭自动提交 auto-upload为false

<el-upload ref="upload" drag action="https://jsonplaceholder.typicode.com/posts/" 
 :file-list="fileList" accept=".txt,.xlsx,.xls,.csv" 
:auto-upload="false" :multiple="false">
       <i class="el-icon-upload"></i>
        <div class="el-upload__text">
           将文件拖到此处，或<em>点击上传</em>
         </div>
          <div class="el-upload__tip" slot="tip">
           只能上传.txt,.xlsx,.xls,.csv文件，且不超过500kb
           </div>
 </el-upload>


 //用ref操作dom实现手动提交
 <el-button  @click="submit" type="success" size="small" icon="el-icon-share">文件上传</el-button>

//点击提交给后端
submit(){
   this.$refs.upload.submit()
 },

2，在表单中文件和其余表单数据一起提交（这种方法对于1的需求也适用，点击提交的时候直接把文件传递过去就行了）

//标签属性设置和上面差别不大  但是这里不需要action地址  可以设置为#

<el-upload ref="upload" drag action="#" 
:on-change="onChange" :file-list="fileList" accept=".txt,.xlsx,.xls,.csv" 
:auto-upload="false" :multiple="false">
       <i class="el-icon-upload"></i>
        <div class="el-upload__text">
           将文件拖到此处，或<em>点击上传</em>
         </div>
          <div class="el-upload__tip" slot="tip">
           只能上传.txt,.xlsx,.xls,.csv文件，且不超过500kb
           </div>
 </el-upload>

onChange(file, fileList) {
 // 这一步，是展示最后一次选择的csv文件 
      if (fileList.length > 0) {
        this.fileList = [fileList[fileList.length - 1]]; 
      }
      this.mutipartFile = new FormData();
      this.mutipartFile.append("file", file.raw);
      this.form.fileName = file.name
    },

 //提交表单
 submitForm() {
     //因为我这里和后端约定的是把表单中数据转换成JSON格式放在FormData中传递过去。
    //处理后的this.mutipartFile传递给后端就可以
    //具体传参格式需要和后端约定好
    this.mutipartFile.set("param", JSON.stringify(this.form));
    console.log(this.mutipartFile);
    axios({
      method:'POST',
      url:请求接口,
      data:this.mutipartFile 
      }).then(res=>{
     console.log('提交成功')
    }),
   },