mirror of
https://github.com/ant-design/ant-design.git
synced 2024-12-05 09:49:57 +08:00
40e77c40d3
* docs: add dark overview * docs: show dark cover in dark theme * docs: update cover
2.5 KiB
2.5 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
Customized Close Text
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 | |
closable | Whether Alert can be closed | boolean | - | |
closeText | Close text to show | ReactNode | - | |
closeIcon | Custom close icon | ReactNode | <CloseOutlined /> |
4.18.0 |
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 }} |