代码实现
<div class="ik-title"> <el-checkbox :indeterminate="isIndeterminate" v-model="checkAll" @change="checkAllChange" >全选</el-checkbox> </div> <div style="width:auto;padding-left:20px;text-align:left;margin-bottom:50px;"> <el-checkbox-group v-model="checkList"> <el-checkbox
v-for="(item,index) in houseSetArr"
:label="item.label"
:key="index"
style="margin-bottom:10px"
>{{item.label}}</el-checkbox> </el-checkbox-group> </div>
<script>
export default {
data() {
return {
checkAll: false,
isIndex: true,
allElection: [],
selectionArr: [],
checkList: [],
houseSetArr:[
｛label:‘测试1‘,id:0｝,
｛label:‘测试2‘,id:1｝,
｛label:‘测试3‘,id:2｝,
｛label:‘测试4‘,id:3｝,
｛label:‘测试5‘,id:4｝,
]
}
},
methods: {
checkAllChange(val) { // 点击全选
this.allElectionFun();
this.checkList = val ? this.allElection : [];
this.isIndex = false;
this.selectionFun(this.checkList);
//console.log(this.selectionArr)
},
allElectionFun() { // 获取需要默认显示的数据
this.allElection = [];
for (var i = 0; i < this.houseSetArr.length; i++) {
this.allElection.push(this.houseSetArr[i].label)
}
},
selectionFun(selectionArr) { // 获取选中的对象
this.selectionArr = [];
for (var i = 0; i < this.houseSetArr.length; i++) {
for (var j = 0; j < selectionArr.length; j++) {
if (selectionArr[j] === this.houseSetArr[i].label) {
this.selectionArr.push(this.houseSetArr[i])
}
}
}
},
}
}
</script>