以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. 高精度模板 val.1

    目录 高精构造 结构体 char数组转高精: 高精加高精 高精乘单精 高精除单精 同样搬以前初三写的... 其实还有个val.2,搬到文章里去了 @ 在做一道斯特林数的时候被卡高精...于是滚来写一些 ...

  2. 加快C++代码的编译速度方法【转载】

    C++代码一直以其运行时的高性能高调面对世人, 但是说起编译速度,却只有低调的份了.比如我现在工作的源代码,哪怕使用Incredibuild调动近百台机子,一个完整的build也需要四个小时,恐怖!! ...

  3. mysql之行转列与列转行

    mysql之行转列与列转行是数据查询的常见操作,以更好的来展示数据,下面就详细说说怎么实现. 行转列 行转列的话,就是将一条一条的行数据记录转换为一条列数据展示,一般来说是根据某一列来做汇总数据的操作 ...

  4. django-channels的部署(supervisor+daphne+nginx)

    项目中需要一个聊天室的功能,所以需要websocket通信,选择了使用channels模块,主要记录下channels部署的配置和一些坑. 原项目是通过nginx+uwsgi部署的,这里我没做任何改动 ...

  5. 番茄助手 最新 Visual Assist X 适应于VS2019 VS2017 VS2015 VS2013 亲测可用

    番茄助手 最新 Visual Assist X 适应于VS2019 VS2017 VS2015 VS2013 亲测可用 如图: 颜色已经改变: 下载说明: /* INSTALLATION 0) Uni ...

  6. condense 参数

    " 删除左右空格,中间空格压缩至一格 result = condense( ' abc def ').result = condense( val = ' abc def '). " ...

  7. vue.js 本地解决跨域

    1.config/index.js下添加proxyTable dev: { // Paths assetsSubDirectory: 'static', assetsPublicPath: '/', ...

  8. 初识orm

    初识orm 一.什么是orm 介绍 ORM: 对象关系映射 将随对象映射成 数据表中的鱼跳跳记录 类--->表名 对象--->记录 对象.属性--->字段 # 演示映射关系 ''' ...

  9. Python语法速查: 15. 常用数据结构

    返回目录 本篇索引 (1)array (2)bisect (3)deque (4)defaultdict (5)namedtuple (6)heapq (7)itertools (1)array ar ...

  10. InfluxDB(一)初探时序数据库

    初探时序数据库-InfluxDB 最近公司有个需求需要借助InfluxDB实现(或者更准确的说,使用该数据库可以更容易的实现),因此稍微看了下这个数据库,把比较重要的一些东西先简单记录一下,日后如果踩 ...