JeecgBoot中BasicTable树形表格checkStrictly属性失效问题解析

问题背景

在JeecgBoot框架的v3.7.1版本中，BasicTable组件在处理树形表格数据时，发现checkStrictly属性设置失效的问题。该属性本应控制树形表格中父子节点选择状态的联动关系，但实际使用时发现父子节点的勾选状态无法正确联动。

技术分析

checkStrictly属性作用

checkStrictly是树形表格中一个重要的属性，它决定了父子节点的选择行为是否相互影响：

• 当设置为true时：父子节点的选择状态完全独立，互不影响
• 当设置为false时：父子节点的选择状态会相互联动
  • 选择父节点会自动选择所有子节点
  • 取消选择子节点会自动取消父节点的选择
  • 当所有子节点都被选中时，父节点会自动被选中

问题根源

通过分析源码，发现问题主要出在以下几个方面：

1. 原有的选择逻辑没有完全考虑树形结构的层级关系
2. 缺少对父节点状态更新的处理逻辑
3. 子节点状态变化时没有正确触发父节点的状态更新

解决方案

开发团队针对此问题进行了修复，主要实现了以下功能：

1. 子节点选择联动

新增了onSelectChild方法，递归处理子节点的选择状态：

function onSelectChild(record, checked) {
  if (条件判断) {
    if (record有子节点) {
      record.children.forEach((child) => {
        updateSelected(child, checked); // 更新子节点状态
        if (child有子节点) {
          onSelectChild(child, checked); // 递归处理
        }
      });
    }
  }
}

2. 父节点选择联动

新增了onSelectParent方法，处理父节点的选择状态：

function onSelectParent(record, checked) {
  if (条件判断) {
    let currentRecord = record;
    while (有父节点) {
      const parent = findParent(tableData, currentRecord);
      if (parent) {
        if (checked) {
          // 检查是否所有子节点都被选中
          const allChildrenSelected = 检查逻辑;
          allChildrenSelected && updateSelected(parent, true);
        } else {
          updateSelected(parent, false);
        }
      }
    }
  }
}

3. 父节点查找逻辑

实现了findParent方法，用于在树形数据中查找指定节点的父节点：

function findParent(tree, record, childrenKey = 'children') {
  let parent = null;
  function search(nodes) {
    for (let node of nodes) {
      if (node[childrenKey]?.some(child => child.id === record.id)) {
        parent = node;
        return true;
      }
      if (node[childrenKey] && search(node[childrenKey])) {
        return true;
      }
    }
    return false;
  }
  search(tree);
  return parent;
}

实现效果

修复后的组件实现了完整的树形表格选择联动功能：

1. 选择父节点时，自动选择所有子节点
2. 取消选择子节点时，自动取消父节点的选择
3. 当所有子节点都被选中时，自动选中父节点
4. 支持多层级树形结构的联动选择

最佳实践

在使用JeecgBoot的BasicTable组件处理树形数据时，建议：

1. 明确是否需要父子节点选择联动
2. 对于复杂树形结构，确保数据格式正确
3. 测试多层级的选择联动效果
4. 注意性能优化，特别是处理大型树形数据时

总结

JeecgBoot框架通过这次修复，完善了BasicTable组件处理树形表格数据的能力，特别是父子节点选择状态的联动功能。这对于需要处理组织架构、分类目录等树形数据的业务场景非常有价值，提供了更加灵活和强大的表格操作体验。