el upload组件 第二次上传请求无效,非clearFiles方法

开发时遇到一个业务需求:

导入时如果当前列表月份存在数据将会提示用户是否要覆盖当前数据,点击确定进行二次提交

直接调用 submit 会无响应,

  this.$confirm(`${response.msg},是否继续?`, '提示', {
          confirmButtonText: 确定,
          cancelButtonText: 取消,
          type: 'warning'
        }).then((res) => {
            // 直接提交会无响应
         this.$refs.upload.submit();
          
          }).catch(() => {})

查询其他资料会发现 大多数会让你 调用

 this.$refs["upload"].clearFiles()

这样的话会让用户重新添加,那么如何去节省该步骤呢? 

当第一次上传成功后回调 on-success 方法 可以获取到上传的文件,这时可以进行保存

 观察el-upload组件源码会发现组件内 存储时有固定的方法handleStart

el-upload组件部分源码:

 因此可以自行调用该方法,去主动触发handleStart()方法进行上传

最后贴上正确步骤

  this.$confirm(`${response.msg},是否继续?`, '提示', {
          confirmButtonText: 确定,
          cancelButtonText: 取消,
          type: 'warning'
        }).then((res) => {
            // 先删除
          this.$refs["upload"].clearFiles()
          this.$nextTick(() => {
            // 再导入
            this.$refs["upload"].handleStart(this.fileList[0].raw)
            this.isUpdateSupport = 1
            // 再提交上传
            this.$refs.upload.submit();
          })
          
          }).catch(() => {})
User-agent: *
Disallow: /
  • 4
    点赞
  • 8
    收藏
    觉得还不错? 一键收藏
  • 2
    评论
评论 2
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值