如果所有Ant设计TreeNode在React.js中没有子节点,如何禁用它们?

时间:2019-03-09 02:22:53

标签: reactjs antd

所以我有这个renderTreeNodes函数...并且禁用绑定到this.state.isTreeDisabled,但是只有具有子级的树节点在AJAX操作期间将被禁用。我将在代码下方附加一个屏幕截图。如果有人知道如何解决这个问题,我将不胜感激。

renderTreeNodes(data) {
  if(data === undefined) return [];
  return data.map(item => {
    if (item.children) {
      return (
        <TreeNode title={item.title} key={item.key}
                  dataRef={item} disabled={this.state.isTreeDisabled}
        >
        {this.renderTreeNodes(item.children)}
        </TreeNode>
      );
    }
    return (<TreeNode {...item} dataRef={item} />);
  });
}

如您所见...它们都是TreeNode对象...但是出于某种原因...只有两个有子节点的对象显示为灰色。

highlighted, selectable nodes while disabled

1 个答案:

答案 0 :(得分:1)

对不起...我一直在盯着太多其他代码...我完全错过了底部的非子级TreeNode部分...我刚刚将disable={this.state.isTreeDisabled}添加到了它并责备...有效

renderTreeNodes(data) {
  if(data === undefined) return [];
  return data.map(item => {
    if (item.children) {
      return (
        <TreeNode title={item.title} key={item.key}
                  dataRef={item} disabled={this.state.isTreeDisabled}
        >
        {this.renderTreeNodes(item.children)}
        </TreeNode>
      );
    }
    // sigh...I didn't notice this bottom TreeNode in the recursive structure...
    return (<TreeNode {...item} dataRef={item} disabled={this.state.isTreeDisabled}/>);
  });
}

gitlab