使用vue+ElementUI的多选框组件时，遇到的问题，请问是什么原因？

Question

在使用ElementUI的单选框和多选框组件时，使用v-for循环渲染，出现点击选择框没有反应，但是绑定的数据却能正确改变
绑定数据的代码如下：

<el-checkbox-group v-model="questions[now_page-1].value" v-if="questions[now_page-1].type=='checkbox'">
    <div v-for='item in questions[now_page-1].options'>
        <el-checkbox :label="item.value"></el-checkbox>
    </div>
</el-checkbox-group>

其中questions[now_page-1].value是一个数组，页面的渲染没有问题，就是点击多选框后，多选框没有变成选中状态，但是此时questions[now_page-1].value却获得了刚刚点击的那个选项的值

请问有人遇到过这种情况吗，请详细说下解决的方法和出现这种问题的原因

Answer 1

可能是数组的原因，js数组没办法做到双向绑定，所以数组数据变了 但是组件没有检测到

Answer 2

为什么el-checkbox要放到div里面？去掉div, 把v-for放到el-checkbox上面

Answer 3

我去看过源代码，你在绑定label的时候要指定id。
如下：

<el-checkbox :indeterminate="isIndeterminate1" v-model="qtcheckAll" @change="handleCheckAllChange(qtcheckAll,'qt')">权限</el-checkbox>
<el-checkbox-group v-model="qtchecked" @change="handleCheckedChange">

    <div class="checkbox-margin">
        <my-checkbox v-for="(item,index) in qtOptions" 
        :label="item.module_id" 
        :key="index" >{{item.module_name}}</my-checkbox>
    </div>

</el-checkbox-group>

在绑定数据时：
this.qtchecked=res.checkedData.map(item => item.module_id);
this.qtOptions = res.data;
就可以了