Vue Alert Component API
Alert API
Explore the API reference for the Vue Alert component and discover how to effectively utilize its props for customization.
On this page CAlert
import { CAlert } from '@coreui/vue-pro'
Props
| Property | Default | Type |
|---|
| ariaCloseLabel5.10.0+ | 'Close' | string |
Sets the aria-label of the dismissible close button. |
| color | - | Color |
Sets the color context of the component to one of CoreUI’s themed colors. |
| dismissible | - | boolean |
Optionally add a close button to alert and allow it to self dismisss. |
| transition5.10.0+ | true | boolean |
Set whether the alert fades in and out when it is shown and hidden. Set to false to make it appear and disappear without a fade animation. |
| variant | - | string |
Set the alert variant to a solid. |
| visible | true | boolean |
Toggle the visibility of alert component. |
Events
| Event name |
|---|
| close |
Event fired when the component requests to be closed. |
| closed |
Event fired after the alert has been closed and the CSS transition has completed. |
CAlertHeading
import { CAlertHeading } from '@coreui/vue-pro'
| Property | Default | Type |
|---|
| as | 'h4' | string |
Component used for the root node. Either a string to use a HTML element or a component. |