mirror of
https://github.com/ant-design/ant-design.git
synced 2024-11-29 05:29:37 +08:00
2.2 KiB
2.2 KiB
category | type | title |
---|---|---|
Components | General | Button |
To trigger an operation.
When To Use
A button means an operation (or a series of operations). Clicking a button will trigger corresponding business logic.
API
To get a customized button, just set type
/shape
/size
/loading
/disabled
.
Property | Description | Type | Default | Version |
---|---|---|---|---|
disabled | disabled state of button | boolean | false |
3.5.1 |
ghost | make background transparent and invert text and border colors, added in 2.7 | boolean | false |
|
href | redirect url of link button | string | - | |
htmlType | set the original html type of button , see: MDN |
string | button |
|
icon | set the icon component of button | ReactNode | - | |
loading | set the loading status of button | boolean | { delay: number } | false |
|
shape | can be set to circle , round or omitted |
string | - | |
size | can be set to small large or omitted |
string | default |
|
target | same as target attribute of a, works when href is specified | string | - | |
type | can be set to primary ghost dashed danger link (added in 3.17) or omitted (meaning default ) |
string | default |
|
onClick | set the handler to handle click event |
(event) => void | - | |
block | option to fit button width to its parent width | boolean | false |
3.8.0 |
It accepts all props which native buttons support.
FAQ
How to remove space between 2 chinese characters
Following the Ant Design specification, we will add one space between if Button contains two Chinese characters only. If you don't need that, you can use ConfigProvider to set autoInsertSpaceInButton
as false
.