el-upload多选文件上传报错解决方案
更新时间：2022年07月10日 09:27:34 作者：暂时想不到叫什么
本文主要介绍了el-upload多选文件上传报错解决方案，文中通过示例代码介绍的非常详细，对大家的学习或者工作具有一定的参考学习价值，需要的朋友们下面随着小编来一起学习学习吧
在element-ui中，el-upload可以进行文件多选操作。
在多选文件上传时，会循环调用上传方法。在第一次循环时，文件可以正常上传，第二次开始就会在
progress事件中报错：
尝试上传2个文件，在这里打印progress事件的参数：
会发现在第二次循环的时候，事件获取不到file，所以接下来的操作无法正常进行。如果不处理这个问题的话，上传方法依然可以使用，只不过最终传上去的只是第一个文件。
本人目前还不知道是什么原因造成了这个结果。但是经过查找相关问题找到了解决办法：
在进行文件多选上传的时候，创建一个中间变量去进行对文件的添加和删除操作，原有的filelist只进行页面列表的显示，在提交表单的时候对数据进行处理，将中间变量的值重新赋给接口需要的字段。这么做的目的就是避免去直接操作filelist。
这里只展示关键部分代码：
/**
* file：上传成功后的文件参数
* isMultiple：true=>多选；false：=>单选
*/
handlePictureSuccess(file,isMultiple){
// 单选、多选是可配字段，在这里进行分别处理
if(isMultiple){
···
// file返回的数据很多，只添加需要的数据
this.realFileList.push({path:file.path,name:file.name,url:file.url})
···
}else{
···
this.fileList.push({path:file.path,name:file.name,url:file.url})
···
}
},
/**
* 提交表单
* form：表单
*/
submitFn(form){
···
const fileList = []
this.$refs.Form.realFileList.forEach(el=>{
fileList.push(el)
})
···
},到此这篇关于el-upload多选文件上传报错解决方案的文章就介绍到这了,更多相关el-upload多选文件上传 内容请搜索脚本之家以前的文章或继续浏览下面的相关文章希望大家以后多多支持脚本之家！
相关文章
这篇文章主要为大家介绍了Vue常见组件间通信方案及典型应用场景详解，有需要的朋友可以借鉴参考下，希望能够有所帮助，祝大家多多进步，早日升职加薪2022-09-09
这篇文章主要为大家介绍了Vite多环境配置时间及vite识别环境变量的规则,有需要的朋友可以借鉴参考下,希望能够有所帮助,祝大家多多进步,早日升职加薪2023-09-09
登录功能对于前端刚入门不久的同学来说较为困难,下面这篇文章主要给大家介绍了关于Vue登录功能实现(含封装axios)的相关资料,文中通过实例代码介绍的非常详细,需要的朋友可以参考下2022-12-12
这篇文章主要介绍了浅谈Vue.js 组件中的v-on绑定自定义事件理解，小编觉得挺不错的，现在分享给大家，也给大家做个参考。一起跟随小编过来看看吧2017-11-11
这篇文章主要介绍了vue3中使用scss加上scoped导致样式失效问题，具有很好的参考价值，希望对大家有所帮助。如有错误或未考虑完全的地方，望不吝赐教2022-10-10
本篇文章主要介绍了vue-Resource（与后端数据交互），小编觉得挺不错的，现在分享给大家，也给大家做个参考。一起跟随小编过来看看吧2017-01-01
本文主要介绍了Vue出现弹出层时禁止底部页面跟随滑动，文中通过示例代码介绍的非常详细，对大家的学习或者工作具有一定的参考学习价值，需要的朋友们下面随着小编来一起学习学习吧2022-07-07
Vue Echarts实现图表轮播图以及图表组件封装和节流函数优化讲解
这篇文章主要介绍了在Vue中优雅的使用Echarts实现图表轮播图、Echarts图表组件封装、节流函数优化图表性能，文中通过示例代码介绍的非常详细，对大家的学习或者工作具有一定的参考学习价值，需要的朋友们下面随着小编来一起学习吧2023-01-01
最近运行vue项目的时候报错了,通过查找相关资料最终解决,下面这篇文章主要给大家介绍了关于vue运行报错cache-loader的解决步骤,文中通过代码介绍的非常详细,需要的朋友可以参考下2024-02-02
vue+video.js视频播放、视频切换、视频断点分段上传功能
本次需求是做一个视频列表，点击视频列表播放对应视频；同时要求实现断点分段上传大文件（视频）的功能,今天通过本文给大家讲解下vue+video.js视频播放、视频切换、视频断点分段上传功能，感兴趣的朋友一起看看吧2022-12-12
最新评论