> ## Documentation Index
> Fetch the complete documentation index at: https://help.dingtalk.io/llms.txt
> Use this file to discover all available pages before exploring further.

# Button

> Reference for the Button component, covering properties such as type, size, and state, along with click event binding for triggering immediate actions on a page.

Buttons trigger an immediate action.

## When to Use

* To mark a single action command (or wrap a group of them) that responds to user clicks and triggers the corresponding business logic.

## Component Example

## Component Properties

| Attribute                  | Description                                                                                                                                         | Type                                                                                                                                                            | Default     |
| -------------------------- | --------------------------------------------------------------------------------------------------------------------------------------------------- | --------------------------------------------------------------------------------------------------------------------------------------------------------------- | ----------- |
| `baseIcon`                 | The base icon of the Button. See the **baseIcon** [property settings](/open/yida/components/basic/icon#component-properties) of the Icon component. | `string`                                                                                                                                                        | -           |
| `behavior`                 | The display state of the form.                                                                                                                      | `'NORMAL' \| 'DISABLED' \| 'HIDDEN'`                                                                                                                            | `'NORMAL'`  |
| `content`                  | The text content of the Button.                                                                                                                     | `string`                                                                                                                                                        | `'Button'`  |
| `contentMarginMobile`      | The left and right margins of the Button on mobile devices.                                                                                         | `'0' \| '16'`                                                                                                                                                   | `'0'`       |
| `loading`                  | Whether the Button is in the loading state.                                                                                                         | `boolean`                                                                                                                                                       | `false`     |
| `otherIcon`                | The additional icon. See the **otherIcon** [property settings](/open/yida/components/basic/icon#component-properties) of the Icon component.        | `string`                                                                                                                                                        | -           |
| `size`                     | The size of the Button.                                                                                                                             | `'small' \| 'medium' \| 'large'`                                                                                                                                | `'medium'`  |
| `triggerEventsWhenLoading` | Whether the Button responds to actions while in the loading state.                                                                                  | `boolean`                                                                                                                                                       | `false`     |
| `type`                     | The type of the Button.                                                                                                                             | `'primary' \| 'normal' \| 'secondary' \| 'ghostLight' \| 'ghostDark' \| 'warningNormal' \|'warningPrimary' \| 'textNormal' \| 'textPrimary' \| 'textSecondary'` | `'primary'` |