2016-10-31 19:31:43 +08:00
---
2017-01-23 22:24:36 +08:00
order: 5
2016-10-31 19:31:43 +08:00
title:
zh-CN: 多个按钮组合
en-US: Multiple Buttons
---
## zh-CN
按钮组合使用时, 推荐使用1个主操作 + n 个次操作, 3个以上操作时把更多操作放到 `Dropdown.Button` 中组合使用。
## en-US
If you need several buttons, we recommend that you use 1 primary button + n secondary buttons, and if there are more than three operations, you can group some of them into `Dropdown.Button` .
2017-01-19 15:19:03 +08:00
````__react
2016-10-31 19:31:43 +08:00
import { Button, Menu, Dropdown, Icon } from 'antd';
function handleMenuClick(e) {
console.log('click', e);
}
const menu = (
< Menu onClick = {handleMenuClick} >
< Menu.Item key = "1" > 1st item< / Menu.Item >
< Menu.Item key = "2" > 2nd item< / Menu.Item >
< Menu.Item key = "3" > 3rd item< / Menu.Item >
< / Menu >
);
ReactDOM.render(
< div >
< Button type = "primary" > primary< / Button >
2017-02-04 22:35:33 +08:00
< Button > secondary< / Button >
2016-10-31 19:31:43 +08:00
< Dropdown overlay = {menu} >
2017-02-04 22:35:33 +08:00
< Button >
2016-10-31 19:31:43 +08:00
more < Icon type = "down" / >
< / Button >
< / Dropdown >
< / div > ,
mountNode
);
````