Vue之AntDesignVue之「a-upload」上传文件列表删除列表中的某个待上传文件时,出现预期想删除的文件与实际删除的文件不一致的问题

这是官网的参考方法

 于是参考此方法,采用beforeUpload 返回 false 后,手动上传文件的上传方法。

这是我的写法

<template>:

js:

@change

 

remove:

 

before-upload:

 

浏览器效果:

添加一个:

 

添加第二个:

 

此时删除最后上传的'测试2.txt'文件,最终结果确实是符合期望的,但是能看到文件列表fileList[]的数组下表index为-1,已经显示异常

 

如果先删除最先上传的'测试1.doc',则会发现删除的是'测试2.txt','测试1.doc'依然存在文件列表fileList[]下,仅仅是页面展示效果看起来是“删除了”

 

原因:

官方提供的before-upload跟remove方法的传入参数其实不一样,beforeUpload的传入是一个file类型,而remove传入的是一个被antD包装过的类型,需要剥...但是官网的示例是没有剥的,两个方法的参数都是一样的,前端同事小伙伴再其电脑帮忙调试后也感到迷惑,在他那边不需要指定file.originFileObj仅传file就能实现效果,并没有出现我的错误....并且antD版本均是1.5.3

 

修改后效果正常(上面的remove()方法中的注释正确写法替换实例写法):

可以看到此时数组下表index=0是正常的,删除的为fileList[0]的'测试1.doc'。

 

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值