elementui el-select change事件传参问题
作者：周家大小姐.
这篇文章主要介绍了elementui el-select change事件传参问题，具有很好的参考价值，希望对大家有所帮助。如有错误或未考虑完全的地方，望不吝赐教
elementui el-select change事件传参
需求:当用户选择select的时候change事件需求获取到当前的整个值
:value的时候把整个item都传进去,用value-key接收就会传给change事件
<el-select v-model="ruleForm.userName" :loading="commissionerListLoading" value-key="item" class="control" placeholder="请选择" @change="handleCommissioer">
<el-option v-for="(item,idx) of commissionerList" :key="idx" :label="item.userName" :value="item"/>
</el-select>但是会发现当赋值的时候数据有变但是视图不变;可以用change中修改
// 选择专员姓名
handleCommissioer(val) {
console.log(val)
this.ruleForm.userName = val.userName
this.ruleForm.userCode = val.userCode
this.getLifeInsurance(val.userCode)
},
el-select的change事件，传递多个值
下拉框列表的change事件，自带一个参数，就是为下拉框选中的值，但是有时候我们需要在带一个参数过去，就会覆盖原来的参数，要怎么办？
这个时候我们可以借助箭头函数，完美解决传参问题。
代码如下：
// An highlighted block
<el-table border stripe :data="searchForm.taxPlanEntityList" style="width: 100%">
<el-table-column label="公司名称" align="center" min-width="140" show-overflow-tooltip>
<template slot-scope="{row,$index}" >
<el-select v-model="row.deptId" placeholder="请选择" @change="(deptId) => handleChangeDeptId(deptId, $index)">
<el-option v-for="item in projectList" :label="item.name" :value="item.deptId" :key="item.deptId"></el-option>
</el-select>
</template>
</el-table-column>
</el-table>方法如下：
handleChangeDeptId(deptId, index) {
console.log(deptId, index) // 这个就是你传过来的值了
}总结
以上为个人经验，希望能给大家一个参考，也希望大家多多支持脚本之家。