vue实战(1)——解决element-ui中upload组件使用多个时无法绑定对应的元素

解决element-ui中upload组件使用多个时无法绑定对应的元素以前写的项目关于图片上传的都是单张或几张图片上传（主要是基于vue的element），图片路径都是固定写的，所以遇见过列表中多个上传图片的问题，先看下常用的形式

正常操作element里面的属性都能满足，当列表中要上传时就不行了，看下实际需求

如下部分代码列表中循环的行图片操作代码接收需要的其它参数

首先列表中的数据都是动态获取的，所以要更改任一张图片就要得到这张图片的索引值index，在el-upload 组件中的:on-success="handleAdPicSuccess"和 :on-change="handleAdPicChange"等这些方法中没有能传参的方式，所以只能在执行这些方法之前添加需要的参数了，方法如下：

把:on-success="handleAdPicSuccess" :on-change="handleAdPicChange" 改成:on-success="(res,file)=>{return handleHeadSuccess(res,file, index)}" :on-change="(res,file)=>{return handleHeadChange(res,file, index)}"这样在调取方法时就能获取每条数据的索引index了！

此方法不一定是最简单的，如果哪位大神有更好的方法，不妨交流交流

转载于:https://juejin.im/post/5b98776de51d450e7632d764

vue实战(1)——解决element-ui中upload组件使用多个时无法绑定对应的元素相关推荐

vue问题三：element ui的upload组件上传图片成功和移除事件
element ui的upload组件上传图片成功和移除事件: 登录后获取到后台传的token存到中: sessionStorage.setItem("token",data.ob ...
element UI上传图片Upload组件使用图片转base64和fale文件处理 formdata数据格式的应用
element UI上传图片Upload组件使用 & 图片转base64和fale文件处理 & formdata数据格式的应用 1.element UI上传图片Upload组件使用效 ...
关于Element UI中select组件中遇到的问题
问题一:在使用select组件设置多选功能后,窗口抖动问题? 详细描述:在我使用select做多选的功能时出现了窗口抖动的问题,测试的时候发现,在有些人的电脑上抖动,有些人的电脑上不抖,找了很多文档, ...
vue中element ui 中tree组件怎么自定义前缀图标呢?
一问题饿了么ui 默认的图标样式是: 1. 一个箭头, 展开自动顺时针旋转90°, 以上的条件是该节点有子节点, 2. 如果是没有子节点的节点, 是默认空白图标的(这里我认为他不是没有, 而是有占 ...
【关于Element UI中el-autocomplete组件】一、el-autocomplete组件添加底部固定按钮
小伙伴们,不知道大家再开发过程中使用el-autocomplete时候会不会遇到需要在下拉建议值中加入自定义按钮,例如添加按钮之类的,如图: 那么这个按钮是如何加上去的呢? 首先我们在这个建议值列表中 ...
element ui 中 Popover 组件定位不精准的问题
问题原因 Popover 内部数据动态获取到之后,Popover 尺寸变化导致的定位不准确. 解决方法动态数据获取到之后,调用 Popover 的 updatePopper() 方法重新计算 Pop ...
Element UI（桌面组件库）之三大灵魂拷问
1. 什么是Element UI 概述 Element,一套为开发者.设计师和产品经理准备的基于 Vue 2.0 的桌面端组件库 Element UI是基于Vue 2.0的 Element UI 提供 ...
关于Element UI中页面样式小问题
一,修改组件dialog窗口的大小二,在我使用upload组件上传一张美女图片时,发现当预览图片时,图片是灰色的,点击一下才会变亮,这种效果使我很不舒服,于是我通过添加下面的一条样式,问题解决了(可 ...
Element UI中Steps 步骤条description描述换行展示
突然要求加了个显示字段,之前的代码只能显示一行,于是乎找到了解决办法,代码如下:其中的属性自行到官网查看释义吧:Element UI官网传送门 <el-table><!-- 可展开的 ...

vue实战(1)——解决element-ui中upload组件使用多个时无法绑定对应的元素

把:on-success="handleAdPicSuccess" :on-change="handleAdPicChange" 改成:on-success="(res,file)=>{return handleHeadSuccess(res,file, index)}" :on-change="(res,file)=>{return handleHeadChange(res,file, index)}"这样在调取方法时就能获取每条数据的索引index了！

此方法不一定是最简单的，如果哪位大神有更好的方法，不妨交流交流

vue实战(1)——解决element-ui中upload组件使用多个时无法绑定对应的元素相关推荐

最新文章

热门文章