vue element table 树形表格 checkbox 全选反选

树形表格带checkbox ，实现结果： 选中父节点 子节点全部选中 反之；子节点如果有一个被选中 父节点选中， 没有一个选中 父节点 取消选中；
html：

data：

 tableData: [{
        id: 3,
        date: '武汉XXXX有限公司',
        zje: '10000',
        children: [{
          id: 31,
          date: 'M110000030',
          name: '固定值（元/月）',
          address: '99'
        }, {
          id: 32,
          date: 'M110000030',
          name: '固定值（元/月）',
          address: '99'
        }]
      }, {
        id: 4,
        date: '武汉XXXX有限公司',
        zje: '10000',
        children: [{
          id: 34,
          date: 'M110000030',
          name: '固定值（元/月）',
          address: '99'
        }, {
          id: 35,
          date: 'M110000030',
          name: '固定值（元/月）',
          address: '99'
        }, {
          id: 36,
          date: 'M110000030',
          name: '固定值（元/月）',
          address: '9900'
        }, {
          id: 37,
          date: 'M110000030',
          name: '固定值（元/月）',
          address: '919'
        }]
      }],

methods：

 // 列表 正选反选
    handleCheckAllChange(row) {
      this.tableData.forEach((item) => {
        //判断是否 有子节点
        if ("children" in item) {
          item.children.forEach(i => {
            //点击父节点 子节点状态 = 父节点状态
            if (row.id === item.id) {
              i.checked = row.checked;
            };
            //点击子节点
            if (i.id === row.id) {
              //父节点状态 = 子节点
              item.checked = row.checked;
              //判断子节点是否有选中的 如果有一个就选中
              item.children.forEach(v => {
                if (v.checked) {
                  item.checked = true;
                };
              });
            };
          });
        };
      });
    },

复制即用 希望对你有帮助~