Ant Design TreeSelect树形选择器禁用父节点

2020-01-07  本文已影响0人  Thomas赵骐
项目中遇到一个需求,如图 image.png

n 个文件夹中含有文件,文件可多选,文件夹不可选。Ant Design TreeSelect的树形组件支持此功能。但父节点子节点都是可选的。
解决方案1:在所有父节点的字段上加上 disabled:true 属性。在 css 中针对ant-select-tree-checkbox-disabled类名添加 display:none 样式。可满足需求。待优化。
解决方案 2:在父节点上加disableCheckbox:true属性(是否可选)。

renderTreeNodes = data => {
    const setData = data.map(item => {
      if (item.children && item.children.length) {
        item.disableCheckbox = true;
        this.renderTreeNodes(item.children);
      }
      return item;
    });
    return setData;
  };
上一篇 下一篇

猜你喜欢

热点阅读