vue.js checkbox 联动

点击chkGroup的checkbox,联动 form-group下面的checkbox 选中或不选中

<template v-for="(i,item) in items">
<div class="group"><input name="chkGroup" type="checkbox" value="checkbox" v-model="item.check" v-on:click="check(i)">{{item.name}}</div>
<div class="row">
        <div class=" form-group" v-for="(index, child) in item.child">
            <input type="checkbox" name="action_code[]" value="{{child.unique}}" id="{{child.unique}}" class="checkbox"  v-model="child.check" />{{child.name}}</div></div>
</template>

 

var vm = new Vue({
        el: '#content',
        data: {           
            items:{"1":{"id":1,"name":"商品管理","letter":"goods","check":"","child":[{"cid":1,"letter":"goods","cname":"商品管理","id":1,"name":"商品管理","columnid":1,"unique":"goods\/index","url":"","show":1,"top":0,"rank":1,"check":"false"},{"cid":1,"letter":"goods","cname":"商品管理","id":2,"name":"添加商品","columnid":1,"unique":"goods\/add","url":"","show":1,"top":0,"rank":1,"check":"false"},{"cid":1,"letter":"goods","cname":"商品管理","id":3,"name":"商品分类","columnid":1,"unique":"goods\/category","url":"","show":1,"top":0,"rank":1,"check":"false"},{"cid":1,"letter":"goods","cname":"商品管理","id":4,"name":"品牌管理","columnid":1,"unique":"brand\/index","url":"","show":1,"top":0,"rank":1,"check":"false"}]},"9":{"id":9,"name":"系统设置","letter":"system","check":"","child":[{"cid":9,"letter":"system","cname":"系统设置","id":5,"name":"后台菜单","columnid":9,"unique":"action_column\/index","url":"","show":1,"top":0,"rank":1,"check":"false"}]},"8":{"id":8,"name":"权限管理","letter":"role","check":"","child":[{"cid":8,"letter":"role","cname":"权限管理","id":6,"name":"管理员列表","columnid":8,"unique":"admin_user\/index","url":"","show":1,"top":0,"rank":1,"check":"false"},{"cid":8,"letter":"role","cname":"权限管理","id":7,"name":"分组管理","columnid":8,"unique":"admin_role\/index","url":"","show":1,"top":0,"rank":1,"check":"false"}]}},
            },
        
        methods: {
            check: function (i) {
                var item=vm.items[i];
                    for (x in item.child){
                        if(item.check){
                            item.child[x].check=flase;
                        }else{
                            item.child[x].check=true;
                        }
                    }
            }
        }
    });

 

你可能感兴趣的:(checkbox,VUE)