element-ui upload组建上传 file-list踩过的坑
昨天修完了一个上传组件删除时,图片删掉了,但是地址仍然在的bug,今天测试告诉我bug没休掉,what !,昨天修完之后我自测了一下,OK的好吗,但是测试给我演示了一下,问题仍然存在!!!我看了一下调试窗口,报错:id 不存在?这个id是写在
我更懵逼了,昨天的file结构怎么和今天的不一样啊,我明明记得昨天的file里面有response的??我仔细想了一下,昨天改完bug之后,我好像加了点东西,为了点击关闭按钮之后能清空图片的,我在upload组建上加了两个属性:

一个ref,和一个:file-list,难道和这两个有关系嘛?我把这俩值注销掉之后,再次打印handleRemove里面的file,数据结构如下:

这才是我昨天看到数据嘛?但是why?是ref影响的,还是file-list影响的?经过测试发现只要把file-list注销掉,file里面就是有response的,原因还是在file-list身上,:file-list='imgList',拿这个imglist是什么东西呢?

在handleSuccess里面可以看到,imglist里面是由response构成的数组,这下我就明白了,删除时的file是从file-list里面拿值,如果file-list里面是response,那么删除时的file就等于response,如果file-lis里面是file,那么删除时的file和上传成功时的file是一样的
element-ui upload组建上传 file-list踩过的坑的更多相关文章
- element ui实现手动上传文件,且只能上传单个文件,并能覆盖上传。
element ui提供了成熟的组件场景,但实际工作中难免会遇到认(sha)真(diao)的产品.比如,最近遇到的,要求实现手动上传特定格式文件(用户点击“上传文件”按钮,确定之后,只是单纯选择了文件 ...
- Vue+Element UI 实现视频上传
一.前言 项目中需要提供一个视频介绍,使用户能够快速.方便的了解如何使用产品以及注意事项. 前台使用Vue+Element UI中的el-upload组件实现视频上传及进度条展示,后台提供视频上传AP ...
- Element UI中的上传文件功能
上传文件给后台: <el-upload style="display:inline-block" :limit=" class="upload-demo& ...
- 封装upload文件上传类
<?php //封装php中的单文件(图片)上传类 /* //参数1:$file 文件数组 5个属性值 name,type,size,tmp,error //参数2:文件保存的路径$pa ...
- Nginx Upload Module 上传模块
传统站点在处理文件上传请求时,普遍使用后端编程语言处理,如:Java.PHP.Python.Ruby等.今天给大家介绍Nginx的一个模块,Upload Module上传模块,此模块的原理是先把用户上 ...
- React antd如何实现<Upload>组件上传附件再次上传已清除附件缓存问题。
最近在公司做React+antd的项目,遇到一个上传组件的问题,即上传附件成功后,文件展示处仍然还有之前上传附件的缓存信息,需要解决的问题是,要把上一次上传的附件缓存在上传成功或者取消后,可以进行清除 ...
- element ui 渲染超过上百条数据时页面卡顿,更流畅的加载大量数据
问题:element ui table渲染上百条数据,页面渲染开始出现延时 解决方案:使用pl-table 注意:设置use-virtual并给定table高度
- 《Play for Java》学习笔记(六)文件上传file upload
一. Play中标准方法 使用表单form和multipart/form-data的content-type类型. 1.Form @form(action = routes.Application.u ...
- jQuery File Upload 图片上传解决方案兼容IE6+
1.下载:https://github.com/blueimp/jQuery-File-Upload 2.命令: npm install bower install ================= ...
随机推荐
- linux 设置默认网关永久
.永久添加 1 2 vim /etc/sysconfig/network GATEWAY=192.168.1.4
- JavaScript基础注意点
1.每个语句结尾一定加上分号 2.JavaScript本身对嵌套{ }的层级没有限制,但是过多的嵌套无疑会大大增加看懂代码的难度.遇到这种情况,需要把部分代码抽出来,作为函数来调用,这样可以减少代码的 ...
- 第三次作业:结对编程--实现表格在APP的导入和显示
031302517 031302319 ps:共同完成一篇随笔,文章中的第一人称我(517),队友(319) 一.功能分析+实现思路+结队讨论 这里我将功能分析和实现思路还有结对过程中的一些讨论结合在 ...
- Oracle中Error while performing database login with the XXXdriver; Listener refused the connection with the following error; ORA-12505,TNS:listener does not currently know of SID given inconnect descrip
一次连接数据库怎么也连接不上,查了多方面资料,终于找到答案,总结 首先应该保证数据库的服务启动 在myeclipse的数据库视图中点 右键->new 弹出database driver的窗口, ...
- Codeforces Educational round 58
Ediv2 58 随手AK.jpg D 裸的虚树,在这里就不写了 E 傻逼贪心?这个题过的比$B$都多.jpg #include <cstdio> #include <algorit ...
- c# C#获取屏幕鼠标坐标点颜色
[DllImport("user32.dll")] private static extern IntPtr GetDC(IntPtr hwnd); [DllImport(&quo ...
- PHP和PHPINFO
PHP开放源码和跨越平台,PHP可以运行在WINDOWS和多种版本的LINUX上.它不需要任何预先处理而快速反馈结果,它也不需要mod_perl的调整来使您的服务器的内存映象减小.PHP消耗的资源较少 ...
- Java实现Zip压缩包解压
对zip压缩包的解压是比较常见的应用场景,java代码的实现也很简单.废话不多说,直接上代码吧 一.代码 /** * zip解压 * @param srcFile zip源文件 * @para ...
- 解决重启centos后resolv.conf总被清空的问题
解决重启centos后resolv.conf总被清空的问题 最近在机器上装了虚拟机virtualbox,然后安装了centos6.4,安装了免费主机控制面板virtualmin,在本地机器上搭建测试网 ...
- linux中wget的使用方法介绍
wget是在Linux下开发的开放源代码的软件,作者是Hrvoje Niksic,后来被移植到包括Windows在内的各个平台上.它有以下功能和特点:(1)支持断点下传功能:这一点,也是网络蚂蚁和Fl ...