The v-tooltip
component is useful for conveying information when a user hovers over an element. You can also programmatically control the display of tooltips through a v-model
. When activated, tooltips display a text label identifying an element, such as a description of its function.
In order for v-tooltip
to be positioned correctly a position prop ( top
| bottom
| left
| right
) is required
Select your desired component from below and see the available props, slots, events and functions.
Below is a collection of simple to complex examples.
A tooltip can be aligned to any of the four sides of the activator element
Tooltip visibility can be programmatically changed using v-model
.