Element ui upload上传组件修改文件上传进度条

1.首先,Element ui官网上upload上传组件文件上传时候进度条是这样显示的:

这样的进度条在实际开发过程中有个问题:上传大文件的时候,进度条为100%后其实文件还并没有上传成功。

这样用户会以为上传成功了就进行其他操作。当然你可以在用户进行操作的时候判断上传状态,如果还正在上传的话弹出提示

但是即使是这样做也不太友好(用户会感觉都没上传成功你为什么给我显示100%)

2.解决以上问题的方法有很多种,殊途同归都是要改变上传的进度条,本文采用的的方法是将进度条改为以下样式:

上传中样式:

上传成功样式:

整体样式跟之前官网的样式一样,只不过去掉了进度条的进度显示改为了转圈圈的样子

需要注意的是:此处的文件列表显示已经不是upload自带的文件列表显示&#

评论 5
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值