antd-filterlist v1.0.4

说明

适合大规模（超过1000条）key-value数据项多选，能够提供无卡顿的使用体验。

初衷是解决antd-transfer大于1000条后异常卡顿的问题。

内部通过分页和搜索防抖实现性能优化。

如果使用中有任何问题，欢迎提issue。

安装

npm install antd-filterlist

使用

import FilterList from "antd-filterlist";

// 该组件依赖 [babel-plugin-import](https://github.com/ant-design/babel-plugin-import) 按需加载antd组件样式,如果样式有问题,请先排除此问题,或导入样式
// import 'antd/dist/antd.css';

const dataSource = Array(1000)
  .fill()
  .map((v, i) => {
    return {
      key: "key" + i,
      value: "value" + i
    };
  }); // 实测10000条以下不卡顿

const comp = 
  <FilterList
    dataSource={dataSource}
    onChange={(keys)=>{console.log(keys)}}/>

在线示例

codesandbox

API