2015-09-27 16:30:35 +08:00
|
|
|
# 按钮类型
|
2015-05-15 16:00:08 +08:00
|
|
|
|
2015-09-27 16:30:35 +08:00
|
|
|
- order: 0
|
2015-06-05 20:26:41 +08:00
|
|
|
|
2015-09-27 16:30:35 +08:00
|
|
|
按钮有三种类型：主按钮、次按钮、幽灵按钮。
|
2015-06-05 20:26:41 +08:00
|
|
|
|
2015-09-27 16:30:35 +08:00
|
|
|
通过设置 `type` 为 `primary` `ghost` 可分别创建主按钮、幽灵按钮，若不设置 `type` 值则为次按钮。不同的样式可以用来区别其重要程度。
|
2015-05-15 16:00:08 +08:00
|
|
|
|
2015-10-26 11:08:36 +08:00
|
|
|
主按钮和次按钮可独立使用，需要强引导用主按钮。幽灵按钮用于和主按钮组合。
|
|
|
|
|
|
2015-05-15 16:00:08 +08:00
|
|
|
---
|
2015-10-20 16:47:55 +08:00
|
|
|
|
2015-09-27 16:30:35 +08:00
|
|
|
````jsx
|
|
|
|
|
var Button = antd.Button;
|
|
|
|
|
|
2015-10-20 16:47:55 +08:00
|
|
|
ReactDOM.render(<div>
|
2015-09-27 16:30:35 +08:00
|
|
|
<Button type="primary">主按钮</Button>
|
|
|
|
|
<Button>次按钮</Button>
|
|
|
|
|
<Button type="ghost">幽灵按钮</Button>
|
|
|
|
|
</div>,
|
|
|
|
|
document.getElementById('components-button-demo-basic'))
|
2015-05-15 16:00:08 +08:00
|
|
|
````
|
2015-09-27 16:30:35 +08:00
|
|
|
|
|
|
|
|
<style>
|
|
|
|
|
#components-button-demo-basic .ant-btn {
|
|
|
|
|
margin-right: 8px;
|
|
|
|
|
margin-bottom: 12px;
|
|
|
|
|
}
|
|
|
|
|
</style>
|
