树形数据异步分页 异步懒加载实现，加父亲节点分页

C7N-UI
#1

  • Choerodon平台版本：0.20.5

  • UI 组件版本：0.8.62

  • 运行环境：自主搭建

  • 问题描述：

    请尽量详细的描述您遇到的问题，以便我们能更快速的提供解决办法。

    如：按照文档操作，choerodon-ui/pro 树形数据能不能展示三级树的形式，我看文档的示例只有两级，自己尝试
    if(record.get(‘parentId’)){
    // 子结点渲染
    return (<span style={{paddingLeft:‘0.18rem’}}/>)
    }
    把这个限制取消，数据会出现混乱的问题，具体数据格式应该是什么样的，父级数据和子集数据是平级关系，还是需要把子集数据放入到父级的children里面？

#2

这个是在线例子忘贴了

#3 

// icon 渲染问题， 首先判断record的值和自定义状态来判断出叶节点和父节点进行不同的渲染
function expandicon({ prefixCls, expanded, expandable, needIndentSpaced, record, onExpand }){
   
  // 1. 这里是只要parentId存在或者text不是组织管理就可以渲染为叶节点
  // 判断它为子节点的方法
  if(record.get('parentId') && record.get('text') !== '组织管理'){
    // 子结点渲染
     return (<span style={{paddingLeft:'0.18rem'}}/>)
  }
  
  if(record.getState('loadding') === true){
   // 自定义状态渲染
     return (<Spin tip="loding"  delay={200} size="small" />)
  } 
  
  // 2. 以上条件都不满足就渲染为父亲节点，所以只要你有方法判定它属于叶节点还是子节点都可以达到目的
  // 这里代码表明它的图标为小三角而且绑定了展开事件等
  const iconPrefixCls = `${prefixCls}-expand-icon`;
  const classString = classNames(iconPrefixCls, {
            [`${iconPrefixCls}-expanded`]: expanded,
        });
  return (<Icon type="baseline-arrow_right" className={classString} onClick={onExpand} tabIndex={expandable ? 0 : -1}/>);
  
}

一般来说只要数据有字段判断该展示为叶节点还是父节点就可以实现你想要的层级展开。

当然不建议嵌套展开太深:joy: