ant-design/components/select/demo/search.tsx
二货爱吃白萝卜 8d7dd80120
docs: Update batch of docs & demos (#44509)
* docs: update select opt

* docs: update form deps demo

* docs: upload onChange

* docs: update form nest Form.List demo
2023-08-29 18:47:41 +08:00

42 lines
856 B
TypeScript

import React from 'react';
import { Select } from 'antd';
const onChange = (value: string) => {
console.log(`selected ${value}`);
};
const onSearch = (value: string) => {
console.log('search:', value);
};
// Filter `option.label` match the user type `input`
const filterOption = (input: string, option: { label: string; value: string }) =>
(option?.label ?? '').toLowerCase().includes(input.toLowerCase());
const App: React.FC = () => (
<Select
showSearch
placeholder="Select a person"
optionFilterProp="children"
onChange={onChange}
onSearch={onSearch}
filterOption={filterOption}
options={[
{
value: 'jack',
label: 'Jack',
},
{
value: 'lucy',
label: 'Lucy',
},
{
value: 'tom',
label: 'Tom',
},
]}
/>
);
export default App;