上一篇关于下拉框的地址在vue中给el-select下拉框传默认值
如果你是来解决bug的,请跳到第3条
<el-select v-model="form.Name">
<el-option v-for="item in dqList" :key="item.dqId" :label="item.name" :value="item.dqId"></el-option>
</el-select>
1.如上我想把dqid和name的值都传给后台,分别传给Name和Code
我们就把:value
改为json
:value="{'Code':item.dqid,'Name':item.name}">
注意这里可能会出现一个bug就是你选择任何一个内容,显示的都是一个固定的名字,不会变化
改成这样试试(呃,经检验这种是没有bug,但是后台接收不到值了就)
:value="[{'Code':item.dqid,'Name':item.name}]">
2.用:value="{'Code':item.dqid,'Name':item.name}">
会出现选中的值不改变的bug
网上最常见的解决方案
this.$set(this.form, 'Name', this.form.Name.Name)
但是并不好用,这样写后台接收不到值,白忙
3.参考了这个作者的方法vue-element 选择框 选择值改变,显示不变
我们的代码修改为
<el-select v-model="form.Name" @input="change">
<el-option v-for="(item, index) in dqList" :key="item.dqId" :label="item.name" :value="index"></el-option>
</el-select>
change (index) {
this.form.Name = this.dqList[index].name
this.form.Code = this.dqList[index].dqId
},
在返回给后台的参数时这样写
'Name': this.form.Name,
'Code': this.form.Code,
注意;这个方法暂不支持clearable