Notifications
Nice simple and interactive notifications.
Notifications Defaults
To add a notification we have the global function $vs.notify
, as the first parameter is a json
with all the necessary attributes or if we only want the standard notification we can only add a string with the text of the notification.
Positions
We can change the place where the notification appears with the property position
a serious example position: 'top-right'
the supported values are:
top-right
top-left
bottom-left
bottom-center
top-center
WARNING
The default notifications appear bottom-right
, it is not necessary to add the position property if it is the desired position.
Icons
Notifications can have icons to give a better user experience and report with a more pleasant and intuitive notification for this is the property icon
a serious example: icon: 'chat'
TIP
Vuesax use the Google Material Icons font library. For a list of all available icons, visit the official Material Icons page.
Fixed and function click
There are times when we need to execute a function when the user clicks on the notification. For this, we have the property that clicks as a value to pass a function to it. Example: click:()=>{ ... }
Time
You can change the delay time in leaving the notification screen with the time
property, example: time: 4000
.
TIP
By default the notifications have a time of 2000 (2s)