elementui el-select change事件传参问题
短信预约 -IT技能 免费直播动态提醒
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) // 这个就是你传过来的值了
}总结
以上为个人经验，希望能给大家一个参考，也希望大家多多支持编程网。
免责声明：
① 本站未注明“稿件来源”的信息均来自网络整理。其文字、图片和音视频稿件的所属权归原作者所有。本站收集整理出于非商业性的教育和科研之目的，并不意味着本站赞同其观点或证实其内容的真实性。仅作为临时的测试数据，供内部测试之用。本站并未授权任何人以任何方式主动获取本站任何信息。
② 本站未注明“稿件来源”的临时测试数据将在测试完成后最终做删除处理。有问题或投稿请发送至: 邮箱/279061341@qq.com QQ/279061341
