elementチェックボックス全選択
8408 ワード
<el-checkbox
:indeterminate="checkList.indeterminate"
v-model="checkList.checkAll"
@change="checkAllChange">
</el-checkbox>
<el-checkbox-group
v-model="checkList.checkValue"
@change="checkChange">
<el-checkbox
v-for="i in checkList.list"
:label="i.key"
:key="i.key">
{{i.name}}
</el-checkbox>
</el-checkbox-group>
<script>
return {
//
checkList:{
indeterminate:true,
checkAll: false, //
list:[
{
name:" 1",
key:"1"
},
{
name:" 2",
key:"2"
}
], //
checkValue:[], //
}
}
// change
checkAllChange(val) {
let list = []
this.checkList.list.forEach(function(item){
list.push(item.key)
})
this.checkList.checkValue = val ? list : [];
this.checkList.indeterminate = false;
},
// change
checkChange(value) {
console.log(value)
console.log(this.checkList.checkValue)
let checkedCount = value.length;
this.checkList.checkAll = checkedCount === this.checkList.list.length;
this.checkList.indeterminate = checkedCount > 0 && checkedCount < this.checkList.list.length;
}
</script>