el-upload使用http-request上传时UI跳动

在使用el-upload组件时，如果使用自定义上传http-request，文件列表file-list是无法自动更新的，需要将文件地址手动push进绑定的file-list中

file-list的官方说明是这样的

上传的文件列表, 例如: [{name: 'food.jpg', url: 'https://xxx.cdn.com/xxx.jpg'}]

然而，按照{name，url}的格式push进入绑定数组后，UI会出现图片反复左右跳动的问题

原因是因为el-upload是用uid做上传列表遍历的key，然后transition-group动画是根据key来的，如果操作了fileList，没有传入uid，导致el-upload的uid重新生成，导致动画过渡有问题

只需要在push时加入一个uid就可以解决了

el-upload上传组件遇到的问题

el-upload使用http-request上传时UI跳动相关推荐

使用ngZorro中Upload自定义上传时XMLHttpRequest问题解决方法
使用ngZorro中Upload自定义上传时XMLHttpRequest问题解决方法使用angular框架写前端的用户一般都比较喜欢用ngZorro,本人最近在使用ngZorro中的Upload自定 ...
关于element upload上传时额外参数的问题
笔者在用上传模块时存在一个问题,每次带的额外参数在第一次时都为空.因为涉及额外参数所以笔者用的是手动上传. <el-uploadclass="upload-demo"ref= ...
【Antd Design Upload】 antd Upload 上传时只有Uploading状态，无法获取返回的数据
问题:antd Upload 上传时只触发Uploading状态,无法获取服务器返回的response,根据控制台的结果发现只有一种Uploading,上传图片时只触发了一次. 根据官网可以知道.上传 ...
【报错笔记】在做图片上传时上传图片后可以跳转到上传成功界面，也没有报错，数据库中也传入了值，可是eclipse中webapp下怎样都无法生存目录。
在做图片上传时上传图片后可以跳转到上传成功界面,也没有报错,数据库中也传入了值,可是eclipse中webapp下怎样都无法生存目录. 我使用UUID生成8级目录,在webapp下创建目录,将图片传进 ...
怎么在电脑安装php文件夹在哪个文件夹,php进行文件上传时找不到临时文件夹怎么办,电脑自动保存的文件在哪里...
php进行文件上传时找不到临时文件夹怎么办PHP上传文件时找不到临时文件夹怎么办,php上传文件时找不到临时文件夹的解决方案:先打开php.ini配置文件:然后修改内容[upload _ tmp _ ...
解决稻香老农无组件上传类在文件上传时当文件名中含中文单双引号取不到正确的文件名的方案
今天完成了对稻香老农的最新版本无组件上传类V2.1的修改. 解决了文件上传时当文件名中含中文单双引号取不到正确的文件名的问题. 参考了无惧上传类,在此感谢稻香老农和梁无惧两位老师,谢谢他们无偿的奉献了 ...
大文件上传时如何做到秒传？
本文已经收录到Github仓库,该仓库包含计算机基础.Java基础.多线程.JVM.数据库.Redis.Spring.Mybatis.SpringMVC.SpringBoot.分布式.微服务.设计模式 ...
大文件上传时如何做到秒传？(荣耀典藏版)
目录前言一.秒传 1.什么是秒传 2.本文实现的秒传核心逻辑二.分片上传 1.什么是分片上传 2.分片上传的场景三.断点续传 1.什么是断点续传 2.应用场景 3.实现断点续传的核心逻辑 4. ...
文件上传时,文件太大会有几种被限制的情况
文件上传时,文件太大会有几种被限制的情况近期在维护一个项目时,商户有反馈,在新增用户时会直接卡住并报错,返回一个异常,应用层没有日志,最后排查出来是nginx限制了请求的最大值. 那么整个链 ...

el-upload使用http-request上传时UI跳动

el-upload使用http-request上传时UI跳动相关推荐

最新文章

热门文章