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 相关文章推荐
Extjs4中的分页应用结合前后台
Dec 13 Javascript
js控制鼠标事件移动及移出效果显示
Oct 19 Javascript
JS模拟按钮点击功能的方法
Dec 22 Javascript
Angular.js如何从PHP读取后台数据
Mar 24 Javascript
详解vue2路由vue-router配置(懒加载)
Apr 08 Javascript
老生常谈js数据类型
Aug 03 Javascript
JS实现对json对象排序并删除id相同项功能示例
Apr 18 Javascript
node.js到底要不要加分号浅析
Jul 11 Javascript
基于javascript的无缝滚动动画1
Aug 07 Javascript
vue使用swiper实现左右滑动切换图片
Oct 16 Javascript
浅谈Ant Design Pro 菜单自定义 icon
Nov 17 Javascript
JS实现扫雷项目总结
May 19 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
PHP Curl出现403错误的解决办法
2014/05/29 PHP
js屏蔽鼠标键盘(右键/Ctrl+N/Shift+F10/F11/F5刷新/退格键)
2013/01/24 Javascript
js中的push和join方法使用介绍
2013/10/08 Javascript
javascript模块化简单解析
2016/04/07 Javascript
jQuery基于ID调用指定iframe页面内的方法
2016/07/06 Javascript
Iphone手机、安卓手机浏览器控制默认缩放大小的方法总结(附代码)
2017/08/18 Javascript
node通过express搭建自己的服务器
2017/09/30 Javascript
jQuery实现所有验证通过方可提交的表单验证
2017/11/21 jQuery
实例解析ES6 Proxy使用场景介绍
2018/01/08 Javascript
angularJs利用$scope处理升降序的方法
2018/10/08 Javascript
浅谈小程序 setData学问多
2019/02/20 Javascript
详解关于React-Router4.0跳转不置顶解决方案
2019/05/10 Javascript
js图片查看器插件用法示例
2019/06/22 Javascript
vue项目中运用webpack动态配置打包多种环境域名的方法
2019/06/24 Javascript
vue ssr+koa2构建服务端渲染的示例代码
2020/03/23 Javascript
jQuery实现评论模块
2020/08/19 jQuery
Vue中component标签解决项目组件化操作
2020/09/04 Javascript
python实现基本进制转换的方法
2015/07/11 Python
Python3删除排序数组中重复项的方法分析
2019/01/31 Python
Python3.5 Pandas模块之Series用法实例分析
2019/04/23 Python
python读取.mat文件的数据及实例代码
2019/07/12 Python
python 牛顿法实现逻辑回归(Logistic Regression)
2020/10/15 Python
Python制作运行进度条的实现效果(代码运行不无聊)
2021/02/24 Python
CSS3 Pie工具推荐--让IE6-8支持一些优秀的CSS3特性
2014/09/02 HTML / CSS
Ted Baker英国官网:男士和女士服装及配件
2017/03/13 全球购物
运行时异常与一般异常有何异同?
2014/01/05 面试题
应用艺术专业个人的自我评价
2014/01/03 职场文书
秋季校运动会广播稿
2014/02/23 职场文书
爱心捐款倡议书范文
2014/05/12 职场文书
三八节标语
2014/06/27 职场文书
班子成员四风问题自我剖析材料
2014/09/29 职场文书
预备党员2014年第四季度思想汇报范文
2014/10/25 职场文书
求职自我评价范文
2015/03/09 职场文书
Python中的 Set 与 dict
2022/03/13 Python
详解Go语言中配置文件使用与日志配置
2022/06/01 Golang
uniapp引入支付宝原生扫码插件步骤详解
2022/07/23 Javascript