antd TreeSelect树选择 搜索框


树型选择控件支持搜索框

import { TreeSelect } from 'antd';

<TreeSelect
showSearch//显示搜索框
treeNodeFilterProp='title'//输入项过滤对应的 treeNode 属性, value或者title
style={{ width: '100%'}}
dropdownStyle={{ maxHeight: 400, overflow: 'auto' }}
placeholder="机构名称"
allowClear
treeDefaultExpandAll
onChange={this.onTreeChange}
onFocus={this.getTreeSelect}
>
{this.treeNodeRender()}
</TreeSelect>,

//js
treeNodeRender = () => {

const { treeNode } = this.state;

if(!treeNode || !treeNode.length){
return;
}

return treeNode.map((v, i) => {
return (
<TreeNode

value={v.medicalInstitutionId}
title={v.medicalInstitutionSimpleCode}
key={i}
>
{v.children && this.treeNodeChildRender(v.children)}
</TreeNode>
);
});
}
 




免责声明!

本站转载的文章为个人学习借鉴使用,本站对版权不负任何法律责任。如果侵犯了您的隐私权益,请联系本站邮箱yoyou2525@163.com删除。



 
粤ICP备18138465号  © 2018-2025 CODEPRJ.COM