element-ui checkbox 组件 全选功能
checkbox 有三种状态：全选(显示的’√’),选中部分(显示的’-’),全不选(啥都没显示)。
checkbox 中的属性 indeterminate，只负责样式控制。indeterminate 属性用以表示 checkbox 的不确定状态，一般用于实现全选的效果。
案例如下：
全选
{
{item.label}}
属性介绍：
1.checkAll：判断是否全选；
2.isIndeterminate：全选按钮的样式控制属性；
3.handleCheckAllChange：checkbox 的 change 事件。
4.query.assignTransportTypeList: checkbox-group 中的选中集合；
5.handleCheckedTransport：checkbox-group 中的 change 事件。
首先默认 checkAll 为 false（未选择），isIndeterminate 为 false（全不选）。
需求分析：当我们点击 checkbox-group 中的复选框时，我们需要判断是否已经全选，对应的样式要更改；当我们点击全选那个复选框时，会传入是选中还是取消选中，如果是选中，则将所有的值都放入到 checkbox-group 绑定的集合中，如果是取消选中，则清空数组中的数据，代码如下：
handleCheckedTransport(value) {
let checkedCount = value.length;
this.checkAll = checkedCount === this.commonData.transportType.length;
this.isIndeterminate = checkedCount > 0 && checkedCount < this.commonData.transportType.length;
}我们可以看的，是否全选，最直接判断就是：选中的长度和数据长度是否一致；isIndeterminate 为 true 时，部分勾选；如果为 false 时，则要么全选，要么全不选。
handleCheckAllChange(val) {
const all = this.commonData.transportType.map(item => {
return item.value
})
this.query.assignTransportTypeList= val ? all : [];
this.isIndeterminate = false;
},这里通过全选按钮来全选数据或者清空选中数据；当全选时，我们将所有的值都放入到 checkbox-group 绑定的集合中，如果是取消选中，则清空数组中的数据。
更多详情，请查看：element-ui 官网 checkbox 组件之 indeterminate 状态。