以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事件中传递自定义参数的更多相关文章

  1. element ui组件的开始时间-结束时间验证

    <el-date-picker v-model="seach.before" type="date" placeholder="开始时间&quo ...

  2. (Element UI 组件 Table)去除单元格底部的横线

    Element UI 组件 Table 有一个属性 border,添加它可以增加纵向边框,但是无法控制横线边框,因此即使是最简单的 el-table,也会包含一个底部横线. 这个底部横线其实是一个 b ...

  3. 解决JS(Vue)input[type='file'] change事件无法上传相同文件的问题

    Html <input id="file" type="file" accept=".map" onchange="uplo ...

  4. element ui源码解析 -- input篇

    el-input是element ui中使用最频繁的组件之一了,分析其构成从四个方面入手:DOM结构,属性,样式,事件入手 DOM结构: <div> <input /> < ...

  5. vue-cli按需引入Element UI组件

    一.环境 使用vue-cli搭建的环境 二.安装 babel-plugin-component npm install babel-plugin-component -D 三.修改.babelrc文件 ...

  6. 如何在element-UI 组件的change事件中传递自定义参数

    以select为例,如果select写在循环里,触发change事件时可能不只需要传递被选中项的值,还要传递index过去,来改变同一循环中的其他标签的状态. 下面这样写是无效的: @change=& ...

  7. <input type="file"> change事件异常处理办法

    问题:最近发现一个奇怪的bug, 那就是在上传图片需要采用input type=file来进行文件选择.由于为了适应美工的UI图,所以是把选择文件的input框隐藏了.然后通过另外一个按钮的点击事件来 ...

  8. 【C#】往按钮事件中传递自定义参数

    情景:代码动态生成的按钮,需要自定义点击事件.但是生成的点击事件的参数是固定的,如何才能传入自定义的参数? Button btn = new Button() { Content = "这是 ...

  9. onchange监听input值变化及input隐藏后change事件不触发的原因与解决方法(设置readonly后onchange不起作用的解决方案)

    转自:https://www.cnblogs.com/white0710/p/7338456.html 1. onchange事件监听input值变化的使用方法: <input id=" ...

随机推荐

  1. 人工智能技术导论——使用PROLOG逻辑语言解决爱因斯坦斑马文件

    一.背景 在上一篇博客https://www.cnblogs.com/wkfvawl/p/12056951.html上,我简单介绍了一下Prolog的一些基本语法,这篇博客主要通过老师课上讲过的一个问 ...

  2. python多线程编程-queue模块和生产者-消费者问题

    摘录python核心编程 本例中演示生产者-消费者模型:商品或服务的生产者生产商品,然后将其放到类似队列的数据结构中.生产商品中的时间是不确定的,同样消费者消费商品的时间也是不确定的. 使用queue ...

  3. puppet5.1 安装与配置

    一.Puppet概念 简介 当服务器数量达到一定的规模时,仅依靠人为完成批量部署服务器个资源的配置,运维工作将变得繁琐且容易出错,为了解决这一问题,我们应该怎么办呢?我们可以引入一批工具,这批工具可编 ...

  4. git提交时忽略指定文件

    git提交时忽略指定文件 我们在项目开发过程中经常用到git来管理自己的项目,使用git版本控制进行多人协作开发具有许多优势,这里就不一一阐述了,有兴趣的同学可以自己去查找资料进行系统的学习.而本篇文 ...

  5. Java编译时常量和运行时常量

    Java编译时常量和运行时常量 编译期常量指的就是程序在编译时就能确定这个常量的具体值. 非编译期常量就是程序在运行时才能确定常量的值,因此也称为运行时常量. 在Java中,编译期常量指的是用fina ...

  6. 【戾气满满】Ubuntu 18.04使用QT通过FreeTDS+unixODBC连接MSSQL填坑记(含泪亲测可用)

    前言 照例废话几句,想玩下QT,但是学习吧总得想点事情做啊,单纯学习语法用法这些?反正我是学不下去的,脑袋一拍,就先学下怎么连接数据库吧!然而万万没想到,我这是给自己挖了一个深深的坑啊! 学习自然去官 ...

  7. 如何安装 IntelliJ IDEA 最新版本——详细教程

    IntelliJ IDEA 简称 IDEA,被业界公认为最好的 Java 集成开发工具,尤其在智能代码助手.代码自动提示.代码重构.代码版本管理(Git.SVN.Maven).单元测试.代码分析等方面 ...

  8. springboot(二):bootstrap和application有什么区别?

    “SpringBoot专注于快速方便的开发单个个体微服务. SpringCloud是关注全局的微服务协调整理治理框架,它将SpringBoot开发的一个个单体微服务整合并管理起来, 为各个服务之间提供 ...

  9. 更改Dynamics 365 Customer Engagement本地部署的高级配置

    我是微软Dynamics 365 & Power Platform方面的工程师罗勇,也是2015年7月到2018年6月连续三年Dynamics CRM/Business Solutions方面 ...

  10. Docker 底层技术与端口映射

    容器底层实现技术  1.cgroup 实现了资源的限额:CPU,内存,硬盘 cgroup使用  docker run -d -m 100M httpd 2.namespace 实现了资源隔离 name ...