antd中treeSelect设置只选择叶子节点

最新推荐文章于 2024-01-05 17:35:30 发布

柒个M

最新推荐文章于 2024-01-05 17:35:30 发布

阅读量2.6k

点赞数

本文链接：https://blog.csdn.net/qq_38244874/article/details/129833424

版权


<TreeSelect
    data-decorator={['arrNew', {
       rules: [{ required: true, message: '请选择' }],
     }]}
    dropdownStyle={{ maxHeight: 400, overflow: 'auto' }}
    // treeData={areaList}
    placeholder='区域位置'
    data-label='选择机台'
    treeDefaultExpandAll
>
 {renderTreeNodes(areaList)}
</TreeSelect>


// 方法：

const renderTreeNodes = data =>
      data.map((item, index) => {
        if (item.children?.length > 0) {
          item.selectable  = false;  //判断如果是父节点则设置不可选择
          return (
            <TreeNode key={item.index} title={item.label} value={item.value} selectable={item.selectable}>
              {renderTreeNodes(item.children)}
            </TreeNode>
          );
        }
        return <TreeNode {...item} key={item.key} title={item.label} value={item.value} />;
      });