点击chkGroup的checkbox,联动 form-group下面的checkbox 选中或不选中url
<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; } } } } });