Alert
Displays important alert messages.
Basic usage
Alert components are non-overlay elements in the page that does not disappear automatically.
Theme
Alert provide two different themes, light and dark.
Customizable close button
Customize the close button as texts or other symbols.
With icon
Displaying an icon improves readability.
Centered text
Use the center attribute to center the text.
With description
Description includes a message with more detailed information.
With icon and description
Attributes
| Attribute | Description | Type | Accepted Values | Default |
|---|---|---|---|---|
| title | title | string | — | — |
| type | Component type | string | success/warning/info/error | info |
| description | Descriptive text. Can also be passed with the default slot | string | — | — |
| closable | If closable or not | boolean | — | true |
| center | Whether to center the text | boolean | — | false |
| close-text | Customized close button text | string | — | — |
| show-icon | If a type icon is displayed | boolean | — | false |
| effect | Choose theme | string | light/dark | light |
Slots
| Name | Description |
|---|---|
| — | description |
| title | content of the Alert title |
Events
| Event Name | Description | Parameters |
|---|---|---|
| close | fires when alert is closed | — |