ant-design/components/select/demo/option-label-prop.tsx
lijianan d549964493
demo: update demo (#40313)
* demo: update demo

* add

* fix lint
2023-01-18 19:20:40 +08:00

55 lines
1.1 KiB
TypeScript

import React from 'react';
import { Select, Space } from 'antd';
const { Option } = Select;
const handleChange = (value: string[]) => {
console.log(`selected ${value}`);
};
const App: React.FC = () => (
<Select
mode="multiple"
style={{ width: '100%' }}
placeholder="select one country"
defaultValue={['china']}
onChange={handleChange}
optionLabelProp="label"
>
<Option value="china" label="China">
<Space>
<span role="img" aria-label="China">
🇨🇳
</span>
China ()
</Space>
</Option>
<Option value="usa" label="USA">
<Space>
<span role="img" aria-label="USA">
🇺🇸
</span>
USA ()
</Space>
</Option>
<Option value="japan" label="Japan">
<Space>
<span role="img" aria-label="Japan">
🇯🇵
</span>
Japan ()
</Space>
</Option>
<Option value="korea" label="Korea">
<Space>
<span role="img" aria-label="Korea">
🇰🇷
</span>
Korea ()
</Space>
</Option>
</Select>
);
export default App;