vue中使用下拉框进行值的传递时,需要传递姓名的同时将id也传过去。
解决方法:要上传两个值就要给两个值分别定义,一个定义在v-model内,另一个给值改变事件获取到想要的值。
话不多说 看栗子
<el-form-item label="实验人员" prop="nickName">
<el-select
class="select"
clearable
value-key="userId"
v-model="form.userId"
placeholder="请选择实验人员"
@change="selectUserId
>
<el-option
v-for="item in option"
:key="item.userId"
:label="item.nickName"
:value="item.userId"
></el-option>
</el-select>
// 获取人员名称列表
getNickName() {
this.loading = true;
listUser(this.queryParams).then(res => {
this.option = res.rows;
});
},
// 获取到用户id
selectUserId(value){
this.option.forEach(e => {
if(e.userId === value){
this.form.nickName = e.nickName
}
})
},