el-table树形结构，带复选框半选择状态（indeterminate）

        >
        
          
        
        
          
        
        
          
        
 

 

processData: [
        {
          id: 1,
          Name: '百里',
          parentId: 0,
          IsAdjust: false,
          IsShow: false,
          children: [
            {
              id: 11,
              parentId: 1,
              Name: '守约',
              IsAdjust: false,
              IsShow: false
            },
            {
              id: 12,
              parentId: 1,
              Name: '玄策',
              IsAdjust: false,
              IsShow: false
            }
          ]
        }
],

adjustCheck(row) {
      // 全选、全不选
      if (row.children) {
        if (row.IsAdjust) {
          row.children.map(item => {
            item.IsAdjust = true
          })
        } else {
          row.children.map(item => {
            item.IsAdjust = false
          })
        }
      }
      this.processData.map(item => {
        if (item.children) {
          item.children.map(it => {
            if (it.parentId === row.parentId) {
              item.IsAdjust = true
            }
          })
          // 子项都选中
          const all = item.children.every(flag => flag.IsAdjust)
          if (all) {
            item.IsAdjust = true
            item.isIndeterminate = false
          }
          const some = item.children.some(flag => flag.IsAdjust)
          // 部分选中半选择状态
          if (some) {
            if (!all) {
              item.isIndeterminate = true
            }
          } else {
            item.IsAdjust = false
            item.isIndeterminate = false
          }
        }
      })
    },

showCheck(row) {
      if (row.children) {
        if (row.IsShow) {
          row.children.map(item => {
            item.IsShow = true
          })
        } else {
          row.children.map(item => {
            item.IsShow = false
          })
        }
      }
      this.processData.map(item => {
        if (item.children) {
          item.children.map(it => {
            if (it.parentId === row.parentId) {
              item.IsShow = true
            }
          })
          // 子项都选中则父选
          const all = item.children.every(flag => flag.IsShow)
          if (all) {
            item.IsShow = true
            item.Indeterminate = false
          }
          const some = item.children.some(flag => flag.IsShow)
          // 部分选中半选择状态
          if (some) {
            if (!all) {
              item.Indeterminate = true
            }
          } else {
            item.IsShow = false
            item.Indeterminate = false
          }
        }
      })
    }