zoukankan      html  css  js  c++  java
  • antd 踩坑:为什么 Tree defaultExpandAll defaultExpandedKeys 在刷新后会失效?

    原因其实很简单。

                  <Tree onSelect={handleTreeClick} defaultExpandedKeys={[rootOrgId]}>
                    {this.renderTreeNodes(OrgTreeData.children)}
                  </Tree>
    renderTreeNodes = data => {
        if (!Array.isArray(data)) {
          return <></>;
        }
        return data.map(item => {
          if (item.children && item.children.length > 0) {
            return (
              <TreeNode title={item.title} key={item.key} dataRef={item}>
                {this.renderTreeNodes(item.children)}
              </TreeNode>
            );
          }
          return <TreeNode key={item.key} dataRef={item} {...item} />;
        });
      };

    如果树节点数据时从接口获取的,那么,这样写就会有一个问题:

    当 Tree 渲染的时候, TreeNode 还没有渲染!

    也就是说,Tree 和 TreeNode 渲染不是同步的。

    这样当然会造成各种问题。只是碰到了这个而已。

    解决方法很简单,让他们一起渲染就行。

                {
                  OrgTreeData && OrgTreeData.children ? 
                  <Tree onSelect={handleTreeClick} defaultExpandedKeys={[rootOrgId]}>
                    {this.renderTreeNodes(OrgTreeData.children)}
                  </Tree> : <></>
                }

    以上。

  • 相关阅读:
    vue 定义全局函数和变量
    大学感受
    NOIP2018 游记
    NOI2018 游记
    THUSC 2018 游记
    APIO2018 游记
    SXOI2018游记
    poorpool 的 考场 NOI Linux 配置
    关于 poorpool
    NOIP2017 游记
  • 原文地址:https://www.cnblogs.com/foxcharon/p/13479719.html
Copyright © 2011-2022 走看看