vue el-checkbox的model不是数组

Question

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

Answer 1

绑定另一个变量，然后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>

Answer 2

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

Answer 3

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

Answer 4

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