项目场景：

最近在使用Ant Design的 Tree 树形控件做树形数据展示，要求全部节点展示

问题描述

在API文档中可以看到defaultExpandAll属性可以设置默认展开所有树节点，但是在使用时发现，无法实现全部节点展开。

原因分析：

1、开始考虑觉得可能是expandedKeys （受控）展开指定的树节点与defaultExpandAll冲突导致；
2、避免1存在的情况测试，发现依旧无法展开全部节点，百度查看说defaultExpandAll在异步加载数据时不生效（default前缀属性只有在初始化时生效，因为异步加载数据时defaultExpandAll已经执行完成）

解决方案：

提示：可以通过受控expandedKeys或者在数据加载完成后渲染Tree来实现全部展开

我这边是使用同事封装的功用树组件，不好变更组件，就选择通过expandedKeys来控制Tree来实现全部展开。

原理：获取各节点下的末位子节点的key(这里就是你给树节点的唯一标识)，再通过expandedKeys实现

部分代码段：

  /*
  * 初始化树形数据展开项回调事件
  * @param treeData 接口获取的tree数据
  * @returns {*}
  * const [expandKey, setExpandKey] = useState<any>([]);
  */
  const mapTreeData = (treeData) => {
    
    
    const setExpandKeys:any = expandKey;
  
    treeData.forEach(child => {
    
    
      if (child.children && child.children.length > 0) {
    
    
        mapTreeData(child.children);
      }
      setExpandKeys.push(child?.id);
    });
    setExpandKey([...setExpandKeys]);
  };

⚠️这里用了递归实现

递归：就是函数的自我调用，通过这种方式，将问题分解成更小的版本的相同问题，从而解决问题。可以对复杂数组进行处理，例如数组嵌套数组，对象嵌套对象，或者更深层的嵌套关系。

这里使用递归而不是循环是因为我们不确定tree嵌套数据会有几层，不知道要遍历几层，递归比循环更加强大的地方在于，递归函数维持着一个保存每次递归调用当前状态的栈，允许函数获得子问题的结果后继续处理，使代码更简洁。

还有一点要注意：
由于递归维持当前状态栈，所以在递归函数中 setExpandKeys:any = expandKey， 保留之前存储的数据。

以上只是简单的记录，有什么表达不明确或者不合理之处，还望指教，希望对你有所帮助