element 复选框全选

<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>