Upload多文件上传

HTML部分

  
     添加
 

    

          
文件名: {{ list.name }} 
  
   上传文件

上述accept 目前限制的类型为 docx、doc、xls、xlsx等。如需要更多类型可以参考
type=file上传文件时accept限制文件类型
除此之外也可根据文件后缀名进行判断upload上传文件限制文件类型

JS部分

beforeUpload(file){
  // 上传之前 把需要上传的文件添加一个集合之中，避免文件单端逐个上传 导致多次请求影响性能 
  this.uploadFile.push(file);
  return false; // 避免直接上传
}
// 上传之前对所选文件 的删除
delFileList(index){
   this.uploadFile.splice(index, 1);
},
// 执行上传
handleUploadFileClick(){
  //创建 formData 对象
   let formData = new FormData();
     //多个文件上传
   for(var i=0; i< this.uploadFile.length; i++){  
      formData.append("filename["+i+"]",this.uploadFile[i].name);   // 文件名称  
      formData.append('type', '1'); // 后端需要的上传类型 根据后端需求 可自行决定是否需要
      formData.append("file["+i+"]", this.uploadFile[i]);  //文件流
  } 
}
this.$fetch({
   url:this.action,
  method:'post',
  data:formData 
}).then((res) =>{
  // 成功之后的操作
})