antd input select

Ant Design是一个React UI组件库，提供了多个组件，其中包括Input和Select组件。这两个组件可以结合使用，例如在Select组件中使用Input组件进行数据过滤。

以下是一个例子：

import { Input, Select } from 'antd';

const { Option } = Select;

function handleChange(value) {
  console.log(`selected ${value}`);
}

function handleSearch(value) {
  console.log(`searched ${value}`);
}

<Select
  showSearch
  style={{ width: 200 }}
  placeholder="Select a person"
  optionFilterProp="children"
  onChange={handleChange}
  onSearch={handleSearch}
  filterOption={(input, option) =>
    option.children.toLowerCase().indexOf(input.toLowerCase()) >= 0
  }
>
  <Option value="jack">Jack</Option>
  <Option value="lucy">Lucy</Option>
  <Option value="tom">Tom</Option>
</Select>

在上面的例子中，我们使用了`showSearch`属性来显示搜索框，使用了`filterOption`属性来设置搜索过滤规则。当用户在Select组件中输入内容时，会触发`onSearch`事件，当用户选择一个选项时，会触发`onChange`事件。同时我们也可以在Select组件中嵌套Input组件来实现更细粒度的搜索功能。