vue2使用element-ui动态生成checkbox后,点击checkbox不能勾选的问题

v-for的数组是通过访问后台接口获取的,通过v-for生成checkbox后,点击checkbox不能勾选,但是能够看到其实绑定了的数组数据是已经发生了变化的。就是页面上的checkbox不会出现选中图案。
试过如果把数据静态绑定到data()里面一点事都没有,动态生成的就会出现这样的情况。好奇怪

<el-checkbox v-for="mpb in permissionBeans" :key="mpb.id" v-model="mpb.checked">{{mpb.name}}</el-checkbox>

点击后有点击的框框出现,但是不会被选中。
clipboard.png

其实mpb.checked的值已经被改变,但是页面上没有出现选中的情况。
clipboard.png

数组结构如下

permissionBeans=[
            {
                "id": 1,
                "name": "查看",
                "checked": false
            },
            {
                "id": 2,
                "name": "回访",
                "checked": false
            },
            {
                "id": 3,
                "name": "编辑",
                "checked": false
            },
            {
                "id": 4,
                "name": "分配",
                "checked": false
            }
        ]
阅读 22.4k
评论
    8 个回答

    我也遇到了这个问题,解决方法是这样的
    把v-model="XXX"改为:checked="XXX"就好了

    评论 赞赏