el-upload添加FormData参数，自定义上传接口

2023-12-14 20:03:47

添加 :http-request="selfUpload"：

<el-upload
 :disabled="saveLoading"
 class="upload-demo"
  :limit="1"
  :on-exceed="handleExceed"
  :before-upload="beforeAvatarUpload"
  :file-list="fileList"
  :auto-upload="true"
  :http-request="selfUpload"
  accept=".xls,.xlsx">
  <el-button size="small" type="primary">上传excel</el-button>
</el-upload>

编写自定义上传方法handleExceed()，在方法里面调用uploadFile()发送上传请求：

selfUpload(params) {
      const formData = new FormData(); 
      formData.append('file', params.file); // 上传文件
      formData.append('wechat', 86654698); // 上传参数
      formData.append('headers', getStore('Access-Token')) // 上传其他参数
      this.uploadFile(formData) // 发送请求
    },
uploadFile(params) {
   this.saveLoading = true
   post('/upload/file',params).then(res=>{
     if(res.data.code===200){
       this.$message.success(res.data.msg)
     }else {
       this.$message.error(res.data.msg)
     }
     this.saveLoading = false
     this.fileList = [] // 清空上传列表
   }).catch((err) => {
  	  this.saveLoading = false
     console.log(err)
   })
 },

文章来源:https://blog.csdn.net/weixin_45750721/article/details/135001817
本文来自互联网用户投稿，该文观点仅代表作者本人，不代表本站立场。本站仅提供信息存储空间服务，不拥有所有权，不承担相关法律责任。