vue el-checkbox的model不是数组

vue el-checkbox的model不是数组,这样选择的话会一起选中,怎么让选择只选中那一个呢,接口里kitchenId不是数组

img

img

img

img

绑定另一个变量,然后watch那个变量值再赋给id


<template>
    <div>
        <el-checkbox-group v-model="checkList">
            <el-checkbox label="aa"></el-checkbox>
            <el-checkbox label="bb"></el-checkbox>
            <el-checkbox label="cc"></el-checkbox>
        </el-checkbox-group>
    </div>
</template>

<script>
export default {
    data() {
        return {
            query: {
                kitchenId: "",
            },
            checkList: [],
        };
    },
    watch: {
        checkList: {
            deep: true,
            handler: function (newVal) {
                this.query.kitchenId = newVal && newVal.join(",");
            },
        },
    },
};
</script>

你query里默认 值给个空数组
kitchenId:[]

el-check-group的v-model接收的是一个数组,如果你想只能选一个,可以将他的最小选择数量设为1,也可人为操控监听他的change事件,每次改变的时候将数组清空,把用户选择的那一个值放进去

img

给你找了一篇非常好的博客,你可以看看是否有帮助,链接:VUE给动态生成的el-checkbox添加v-model