element-ui组件中input等的change事件中传递自定义参数


Posted in Javascript onMay 22, 2019

以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事件中传递自定义参数,希望对大家有所帮助,如果大家有任何疑问请给我留言,小编会及时回复大家的。在此也非常感谢大家对三水点靠木网站的支持!
如果你觉得本文对你有帮助,欢迎转载,烦请注明出处,谢谢!        

Javascript 相关文章推荐
javascript 多级checkbox选择效果
Aug 20 Javascript
js select option对象小结
Dec 20 Javascript
JavaScript生成SQL查询表单的方法
Aug 13 Javascript
javascript实现html页面之间参数传递的四种方法实例分析
Dec 15 Javascript
JS &amp; JQuery 动态添加 select option
Jun 08 Javascript
BootStrap入门教程(三)之响应式原理
Sep 19 Javascript
原生js实现轮播图的示例代码
Feb 20 Javascript
Vue2.x中的Render函数详解
May 30 Javascript
vue Render中slots的使用的实例代码
Jul 19 Javascript
Windows安装Node.js报错:2503、2502的解决方法
Oct 25 Javascript
JS定时器如何实现提交成功提示功能
Jun 12 Javascript
React实现阿里云OSS上传文件的示例
Aug 10 Javascript
原生JS实现列表内容自动向上滚动效果
May 22 #Javascript
小程序如何使用分包加载的实现方法
May 22 #Javascript
原生js实现trigger方法示例代码
May 22 #Javascript
koa router 多文件引入的方法示例
May 22 #Javascript
微信小程序template模板与component组件的区别和使用详解
May 22 #Javascript
微信小程序+腾讯地图开发实现路径规划绘制
May 22 #Javascript
详解wepy开发小程序踩过的坑(小结)
May 22 #Javascript
You might like
索尼SONY ICF-SW7600GR电路分析与改良
2021/03/02 无线电
ASP和PHP都是可以删除自身的
2007/04/09 PHP
php实现将base64格式图片保存在指定目录的方法
2016/10/13 PHP
javascript 当前日期加(天、周、月、年)
2009/08/09 Javascript
EasySlider 基于jQuery功能强大简单易用的滑动门插件
2010/06/11 Javascript
一个可绑定数据源的jQuery数据表格插件
2010/07/17 Javascript
Enter转换为Tab的小例子(兼容IE,Firefox)
2013/11/14 Javascript
JavaScript提升性能的常用技巧总结【经典】
2016/06/20 Javascript
jQuery实现可拖拽的许愿墙效果【附demo源码下载】
2016/09/14 Javascript
jQuery实现 RadioButton做必选校验功能
2017/06/15 jQuery
js设置鼠标悬停改变背景色实现详解
2019/06/26 Javascript
微信小程序实现上拉加载功能示例【加载更多数据/触底加载/点击加载更多数据】
2020/05/29 Javascript
如何运行Python程序的方法
2013/04/21 Python
python字符串连接方式汇总
2014/08/21 Python
利用Python脚本在Nginx和uwsgi上部署MoinMoin的教程
2015/05/05 Python
Python中操作mysql的pymysql模块详解
2016/09/13 Python
用python记录运行pid,并在需要时kill掉它们的实例
2017/01/16 Python
python交互式图形编程实例(一)
2017/11/17 Python
Python实现的读取/更改/写入xml文件操作示例
2018/08/30 Python
python在html中插入简单的代码并加上时间戳的方法
2018/10/16 Python
python3.6使用pickle序列化class的方法
2018/10/22 Python
python异步存储数据详解
2019/03/19 Python
python、Matlab求定积分的实现
2019/11/20 Python
在python中求分布函数相关的包实例
2020/04/15 Python
Burberry英国官网:英国标志性奢侈品牌
2017/03/29 全球购物
巴西最大的家具及装饰用品店:Mobly
2017/10/11 全球购物
英国国家美术馆商店:National Gallery
2019/05/01 全球购物
大学生职业生涯规划书范文
2014/01/14 职场文书
致跳远运动员加油稿
2014/02/11 职场文书
自行车广告词大全
2014/03/21 职场文书
中学优秀班主任事迹材料
2014/05/01 职场文书
2015年卫生监督工作总结
2015/05/21 职场文书
公务员的复习计划书,请收下!
2019/07/15 职场文书
Java实现多线程聊天室
2021/06/26 Java/Android
十大冰系宝可梦排名,颜值最高的阿罗拉九尾,第三使用率第一
2022/03/18 日漫
Windows Server 2019 安装DHCP服务及相关配置
2022/04/28 Servers