我们看antd的官方示例demo中有普通的transfer按照条件筛选数据,可是并没有提供TreeTransfer的demo示例。

普通的筛选数据的demo:
Antd的TreeTransfer按照父级筛选数据_antd教程
那么我们就只好看看他这个组件的API。
Antd的TreeTransfer按照父级筛选数据_antd学习_02
发现了这俩个东西是我们要的,
showSearch用来展示搜索框,
onSearch用来改变我们的数据。

比较简单的一个实现思路就是在你的onSearch里面去筛选你的dataSource数据:

// 只写了本功能相关的关键代码,其他代码请自行处理,【可以到antd里面弄固定的假数据测试】
<TreeTransfer
  dataSource={this.state.departmentList || []}
  showSearch
  onSearch={(dir, val) => {
  	 // primitiveDept里的数据是departmentList的全部数据,我们根据它的全部数据加上我们的筛选条件去处理departmentList。
  	 const { primitiveDept } = this.state;
  	 // 笔者只是过滤左边的数据,请根据你自身实际需求改下方代码
     if (dir === 'left') {
       const newDeptList = primitiveDept.filter(item => item.name.indexOf(val) > -1);
       this.setState({ departmentList: newDeptList });
     }
  }}
/>

实现效果:

Antd的TreeTransfer按照父级筛选数据_antd学习_03
还有什么问题下方评论即可。