ant-design/components/select/demo/optgroup.md

40 lines
721 B
Markdown
Raw Normal View History

2016-03-31 09:40:55 +08:00
---
2018-05-21 17:07:39 +08:00
order: 6
title:
2016-07-10 08:55:43 +08:00
zh-CN: 分组
en-US: Option Group
2016-03-31 09:40:55 +08:00
---
2015-08-01 17:51:55 +08:00
2016-07-10 08:55:43 +08:00
## zh-CN
2016-01-28 12:16:18 +08:00
`OptGroup` 进行选项分组。
2015-08-01 17:51:55 +08:00
2016-07-10 08:55:43 +08:00
## en-US
Using `OptGroup` to group the options.
```tsx
import { Select } from 'antd';
2022-05-23 14:37:16 +08:00
import React from 'react';
2018-06-27 15:55:04 +08:00
2017-04-13 23:27:03 +08:00
const { Option, OptGroup } = Select;
2015-08-01 17:51:55 +08:00
const handleChange = (value: string) => {
console.log(`selected ${value}`);
};
2015-08-01 17:51:55 +08:00
const App: React.FC = () => (
2019-05-07 14:57:32 +08:00
<Select defaultValue="lucy" style={{ width: 200 }} onChange={handleChange}>
2015-08-19 13:50:57 +08:00
<OptGroup label="Manager">
<Option value="jack">Jack</Option>
<Option value="lucy">Lucy</Option>
2015-08-01 17:51:55 +08:00
</OptGroup>
2015-08-19 13:50:57 +08:00
<OptGroup label="Engineer">
<Option value="Yiminghe">yiminghe</Option>
2015-08-01 17:51:55 +08:00
</OptGroup>
</Select>
2018-11-28 15:00:03 +08:00
);
export default App;
2019-05-07 14:57:32 +08:00
```