ant design的Tree树形控件useMemo中先获取到初始数据再执行return

根据文档的内容：
在 3.4.0 之前：树节点可以有很多，但在设置 checkable 时，将会花费更多的计算时间，因此我们缓存了一些计算结果（this.treeNodesStates）来复用，避免多次重复计算，以此提高性能。但这也带来了一些限制，当你异步加载树节点时，你需要这样渲染树：

{
    
    
  this.state.treeData.length ? (
    <Tree>
      {
    
    this.state.treeData.map((data) => (
        <TreeNode />
      ))}
    </Tree>
  ) : (
    'loading tree'
  );
}

解决办法：

  const treeData = useMemo(() => {
    
    
  //新增一个defaultData函数会一直循环，所以就defaultData.length
  }, [defaultData.length, searchValue]);

     {
    
    
            treeData?.length ? (
              <Tree
                onExpand={
    
    onExpand}
                expandedKeys={
    
    expandedKeys}
                autoExpandParent={
    
    autoExpandParent}
                treeData={
    
    treeData}
                defaultExpandAll={
    
    true}
              />
            ) : (
              'loading tree'
            )
          }

下面是自己没看文档最下面的内容，自己折腾了几天的愚蠢操作：
首先是删掉了generateData(z)初始化数据的函数，然后把const defaultData: DataNode[] = [];换成 const [defaultData, setDefaultData] = useState<DataNode[]>([])，新增了一个const isflag = React.useRef(0);标识符，目的是等会再次执行useMemo函数

  const treeData = useMemo(() => {
    
    
    getorganizationsRelations().then((res) => {
    
    
      //在接口里获取到想要的数据
      setDefaultData(data)
    })
    
 if (defaultData?.length !== 0 && defaultData?.length !== undefined) {
    
    
  	  // 执行generateList函数返回loop()函数
 	  generateList(defaultData)
      return loop(defaultData);
    } else {
    
    
      //一开始defaultData是[]，所以先执行这一步，让 isflag.current 的值发生变化，然后再次执行useMemo函数，此时defaultData就会有值走上面
      isflag.current = 1
    }
  }, [isflag.current, searchValue]);