mirror of
https://gitee.com/ant-design/ant-design.git
synced 2024-12-04 13:08:41 +08:00
827ada2da6
* refactor: refactor closeIcon * feat: update test case * feat: optimize code * feat: remove demo about closeText * feat: remove demo about closeText * feat: optimize code * feat: optimize code * feat: optimize code * feat: optimize code * feat: optimize code * feat: optimize code * feat: optimize code * feat: optimize code
2.4 KiB
2.4 KiB
category | title | cover | coverDark | demo | group | ||||||
---|---|---|---|---|---|---|---|---|---|---|---|
Components | Alert | https://mdn.alipayobjects.com/huamei_7uahnr/afts/img/A*Ct7bT7rrTTAAAAAAAAAAAAAADrJ8AQ/original | https://mdn.alipayobjects.com/huamei_7uahnr/afts/img/A*-U3XQqYN7VsAAAAAAAAAAAAADrJ8AQ/original |
|
|
Alert component for feedback.
When To Use
- When you need to show alert messages to users.
- When you need a persistent static container which is closable by user actions.
Examples
Basic
More types
Closable
Description
Icon
Banner
Loop Banner
Smoothly Unmount
ErrorBoundary
Custom Icon
Custom action
API
Property | Description | Type | Default | Version |
---|---|---|---|---|
action | The action of Alert | ReactNode | - | 4.9.0 |
afterClose | Called when close animation is finished | () => void | - | |
banner | Whether to show as banner | boolean | false | |
closeIcon | Custom close icon, >=5.7.0: close button will be hidden when setting to null or false |
boolean | ReactNode | <CloseOutlined /> |
|
description | Additional content of Alert | ReactNode | - | |
icon | Custom icon, effective when showIcon is true |
ReactNode | - | |
message | Content of Alert | ReactNode | - | |
showIcon | Whether to show icon | boolean | false, in banner mode default is true |
|
type | Type of Alert styles, options: success , info , warning , error |
string | info , in banner mode default is warning |
|
onClose | Callback when Alert is closed | (e: MouseEvent) => void | - |
Alert.ErrorBoundary
Property | Description | Type | Default | Version |
---|---|---|---|---|
description | Custom error description to show | ReactNode | {{ error stack }} | |
message | Custom error message to show | ReactNode | {{ error }} |