antd table 筛选

Ant Design的Table组件提供了很多筛选功能，包括列筛选和全局筛选，可以根据不同的需求进行选择。

1. 列筛选

列筛选可以让用户通过下拉框的方式选择需要显示的数据。在Table的columns配置中，每个列都可以通过filters属性配置筛选项，例如：

const columns = [
  {
    title: '姓名',
    dataIndex: 'name',
    key: 'name',
    filters: [
      { text: '张三', value: '张三' },
      { text: '李四', value: '李四' },
    ],
    onFilter: (value, record) => record.name.includes(value),
  },
  {
    title: '年龄',
    dataIndex: 'age',
    key: 'age',
    filters: [
      { text: '30岁以下', value: '30' },
      { text: '30岁以上', value: '30+' },
    ],
    onFilter: (value, record) => {
      if (value === '30') {
        return record.age < 30;
      }
      if (value === '30+') {
        return record.age >= 30;
      }
      return false;
    },
  },
  // 其他列
];

其中，filters属性是一个数组，每个元素代表一个筛选项，包括text（显示文本）和value（筛选值）两个属性。onFilter属性是一个回调函数，用于筛选数据，返回true表示数据满足筛选条件。

2. 全局筛选

全局筛选可以让用户输入关键字，筛选出包含关键字的数据。在Table的props中，可以使用search属性配置全局筛选，例如：

function onSearch(value) {
  console.log(value);
}

<Table columns={columns} dataSource={data} search={{ onSearch }} />

其中，onSearch是一个回调函数，用于处理搜索事件。当用户输入关键字并点击搜索按钮时，会触发onSearch函数，参数value代表用户输入的关键字。

以上是Ant Design的Table组件提供的筛选功能，可以根据具体的需求进行选择和使用。