关于Element-UI Upload 上传图片第二次或第N次无反应的问题

如果我们设置了 :limit="1" ,在我们上传完成第一张图片后,如果想更改当前的图片那么很幸运的告诉你,不行、没效果。发现后是不是立刻百度,会发现很多错综复杂的解决方案!直到自己眼晕脑胀也没有一点办法,那么很幸运的告诉你,你找到了我!

导致整个问题的原因是因为你没有清除当前 files,导致他一直保存这你第一次上传文件的信息,只要你把他一刀切掉就好了!

那么问题来了,应该怎么清除呢!看下面的代码:

//只需要给你的el-upload 定义一个ref就可以
<el-upload class="upload-demo" ref="upload">
   <el-button size="small" type="primary">点击上传</el-button>
</el-upload>

然后,我们既然定义了ref 那么是不是就可以拿到它的document元素,那么岂不是很简单了,只需要在每次成功后给它清除掉就可以了,看码:

successUpload(response, file, fileList) {
    this.$refs.upload.clearFiles(); //上传成功之后清除历史记录
}

这样就能解决你不能继续长传的问题了!

希望看完的朋友可以点个喜欢/关注,您的支持是对我最大的鼓励。

如果喜欢本文的话,欢迎关注我的订阅号,漫漫技术路,期待未来共同学习成长。

  • 20
    点赞
  • 8
    收藏
    觉得还不错? 一键收藏
  • 12
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论 12
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值