element-ui组件中的input等的change事件中传递自定义参数
以select为例,如果select写在循环里,触发change事件时可能不只需要传递被选中项的值,还要传递index过去,来改变同一循环中的其他标签的状态。
下面这样写是无效的:
@change="changeStatus(val, index)"
<div v-for="(item,index) in itemList">
<el-select v-model="item.value" @change="changeStatus(val, index)">
<el-option v-for="op in options"
:key="op.key":
:label="op.label"
:value="op.label">
</el-option>
</el-select>
</div>
这样再封装一层就可以了:
@change="((val)=>{changeStatus(val, index)})"
<div v-for="(item,index) in itemList">
<el-select v-model="item.value" @change="((val)=>{changeStatus(val, index)})">
<el-option v-for="op in options"
:key="op.key"
:label="op.label"
value="op.label">
</el-option>
</el-select>
</div>
element-ui组件中的input等的change事件中传递自定义参数的更多相关文章
- element ui组件的开始时间-结束时间验证
<el-date-picker v-model="seach.before" type="date" placeholder="开始时间&quo ...
- (Element UI 组件 Table)去除单元格底部的横线
Element UI 组件 Table 有一个属性 border,添加它可以增加纵向边框,但是无法控制横线边框,因此即使是最简单的 el-table,也会包含一个底部横线. 这个底部横线其实是一个 b ...
- 解决JS(Vue)input[type='file'] change事件无法上传相同文件的问题
Html <input id="file" type="file" accept=".map" onchange="uplo ...
- element ui源码解析 -- input篇
el-input是element ui中使用最频繁的组件之一了,分析其构成从四个方面入手:DOM结构,属性,样式,事件入手 DOM结构: <div> <input /> < ...
- vue-cli按需引入Element UI组件
一.环境 使用vue-cli搭建的环境 二.安装 babel-plugin-component npm install babel-plugin-component -D 三.修改.babelrc文件 ...
- 如何在element-UI 组件的change事件中传递自定义参数
以select为例,如果select写在循环里,触发change事件时可能不只需要传递被选中项的值,还要传递index过去,来改变同一循环中的其他标签的状态. 下面这样写是无效的: @change=& ...
- <input type="file"> change事件异常处理办法
问题:最近发现一个奇怪的bug, 那就是在上传图片需要采用input type=file来进行文件选择.由于为了适应美工的UI图,所以是把选择文件的input框隐藏了.然后通过另外一个按钮的点击事件来 ...
- 【C#】往按钮事件中传递自定义参数
情景:代码动态生成的按钮,需要自定义点击事件.但是生成的点击事件的参数是固定的,如何才能传入自定义的参数? Button btn = new Button() { Content = "这是 ...
- onchange监听input值变化及input隐藏后change事件不触发的原因与解决方法(设置readonly后onchange不起作用的解决方案)
转自:https://www.cnblogs.com/white0710/p/7338456.html 1. onchange事件监听input值变化的使用方法: <input id=" ...
随机推荐
- vue-UI(mui和muit-UI)
MUI和MUIT-UI 这里使用了连个UI---mui和mit-ui mit-ui是基于vue.js的,而mui是一个高性能前端框架(H5+提供的),类似于bootstrap,所以在引入时区别还是很大 ...
- 云原生技术之Docker入门
1. 为什么需要容器? 下图是一个比较传统的软件架构 做过java的同学可能对上图的架构方式比较了解,我们通常会将一个应用程序生成一个war包,放到一个tomcat容器当中并在一台虚拟机(VM)中启动 ...
- C++之typename和typedef关键字
1. typename的作用 template <typename Distance> class KDTreeIndex : public NNIndex<Distance> ...
- Python高级特性——列表生成式(list Comprehensions)
List Comprehensions 即列表生成式,是Python内置的强大的用来生成列表list的生成式. 简单菜: >>> l = list(range(2,13)) > ...
- .Net Core 项目发布到Linux - CentOS 7(二)用Supervisor守护netcore进程
简介 supervisor可以保证程序崩溃后,可以重新把程序启动起来等相关功能. 安装 yum install -y supervisor 安装好后在/etc/会生成一个supervisord.con ...
- php 将科学计算法得出的结果转换成原始数据 NumToStr
由于php最大只支持显示 15位因的数据运算,大于15位的2数加减乘除的数据的结果,会直接用科学计数法显示, 但在现实生活中,科学计数法不利于普通人识别,所以,本函数将:科学计数法的出的结果转换成原始 ...
- 了解Bootstrap和开发响应式网站
什么是Bootstrap? Bootstrap是Twitter推出的一个开源的用于web前端开发的工具包.它由Twitter的设计师Mark Otto和Jacob Thornton合作开发,是一个CS ...
- 微店APP协议简要分析
1.通过抓包软件charles进行抓包,点击微信收款后,抓包内容都是加密处理过 2.加载分析定位这些字段的加密函数. WDTNThorParameterProcessor HTTPBody:task ...
- iPhone 启动页尺寸
iPhone 启动页尺寸 4 640*960 5 640*1136 6 750*1334 6p 1242*2208
- Spring学习的第二天
第二天总共学习了以下内容: spring中的ioc常用注解: 案例使用xml方式和注解方式实现单表的CRUD操作(但还是需要xml配置文件,并不是纯注解的配置): 改造基于注解的Ioc案例,使用纯注解 ...