Vue中select多选绑定对象数组
实现需求,el-select多选框绑定由对象组成的数组items格式要求[{obj},{obj}…]<el-form-item label="服务项目" prop="items"><el-selectv-model="form.items"@change="selectChangeChild"placeholder="请选择"multiplevalue-key="serviceI
·
实现需求,el-select多选框绑定由对象组成的数组
items格式要求[{obj},{obj}…]
<el-form-item label="服务项目" prop="items">
<el-select
v-model="form.items"
@change="selectChangeChild"
placeholder="请选择"
multiple
value-key="serviceItemId"
>
<el-option
v-for="(item, index) in serviceItemOptions"
:key="index"
:label="item.itemName"
:value="item"
/>
</el-select>
</el-form-item>
serviceItemOptions是一个由对象组成的数组列表。
用@change事件跟踪绑定的值:item
selectChangeChild(item) {
console.log(item); //value是item
this.form.minUnit = item[0].minUnit; //影响后续的子操作
},
这里需要注意的地方是el-select组件需要value-key绑定item里serviceItemId作为唯一标识
ps:
官方文档:如果 Select 的绑定值为对象类型,请务必指定 value-key 作为它的唯一性标识。
value-key 作为 value 唯一标识的键名,绑定值为对象类型时必填。
更多推荐
已为社区贡献2条内容
所有评论(0)