摘要:
在使用el-upload组件上传图片时,由于在上传成功后file-list被更新导致图片闪动。问题的关键在于uid的变化。解决方案是在回调函数中保持uid不变,将响应数据的uid设置为原始file的uid,从而避免闪动现象。通过这种方式,可以确保上传文件时不会出现闪烁问题。
原理:
是因为在上传会调时赋予了新的file-list,图片信息是根据uid为标识,uid变了,所以会出现这样的情况,我们只需要修改url即可,所以在给file-list赋值时应该继承之前的uid
解决:
只需要在上传成功的回调继承一下uid即可,代码如下:
fileSaveList(response, file, fileList) {
if (response) {
if (response.success) {
let attachmentInfo = response.data
attachmentInfo.uid = file.uid;
this.attachmentInfo.push(attachmentInfo);
} else {
this.$message.error(response.message);
}
}
},
上传文件时如果出现闪一下的问题也可以通过以上原理处理一下