treeSelect节点搜索

最新推荐文章于 2024-03-26 22:43:25 发布

小栗桔

最新推荐文章于 2024-03-26 22:43:25 发布

阅读量1k

点赞数

分类专栏： antd 遇到的坑文章标签：前端

本文链接：https://blog.csdn.net/weixin_43140590/article/details/131400878

版权

antd 同时被 2 个专栏收录

2 篇文章 0 订阅

订阅专栏

遇到的坑

2 篇文章 0 订阅

订阅专栏

antd中treeSelect的filterTreeNode用法--节点搜索

以下图为例，树形搜索展开后，有以下几个选项，如果我想要搜索其中“产品中心”，那直接搜索关键词‘产品’即可
在这里插入图片描述

我搜索后并未显示我想要的结果，而是为空
在这里插入图片描述

这就需要用到 filterTreeNode这个属性了。
官方介绍：是否根据输入项进行筛选，默认用 treeNodeFilterProp 的值作为要筛选的 TreeNode 的属性值;boolean | function(inputValue: string, treeNode: TreeNode) (函数需要返回 bool 值)
添加filterTreeNode属性，

	filterTreeNode={(inputValue, treeNode) => {
        return treeNode?.name.indexOf(inputValue) > -1;
        }}
        //这里name要看treeNode节点的结构是什么样了，可以是title，value

结果展示
在这里插入图片描述