在项目开发中,使用多选框组,选中时想要取到该项的id而不是label值:
checkbox-group:Element ui 中的组件,只需要在 Group 中使用v-model绑定Array类型的变量即可,并且绑定change实践, el-checkbox 的 label属性是该 checkbox 对应的值,所以只要label绑定id就可以了,显示的话使用label;
<el-checkbox-group v-model="checked" @change="test">
<el-checkbox v-for="item in checkList"
:key="item.id"
:label="item.id"
>{{item.label}}
</el-checkbox>
</el-checkbox-group>
<script>
export default {
data(){
return {
checked: [],
checkList: [
{id: 0001, label: '飞机'},
{id: 0002, label: '轮船'},
{id: 0002, label: '汽车'},
{id: 0002, label: '火车'},
],
}
},
methods: {
test(val){
this.checked = val;
console.log(this.checked)
}
}
}
</script>