Usage
{
"message": "You should use slots with <ContentRenderer>",
"value": null,
"excerpt": false,
"tag": "div"
}Mode
Use the mode prop to switch between click and hover modes.
{
"message": "You should use slots with <ContentRenderer>",
"value": null,
"excerpt": false,
"tag": "div"
}Manual
Use a v-model:open to manually control the state. In this example, press O to toggle the popover.
{
"message": "You should use slots with <ContentRenderer>",
"value": null,
"excerpt": false,
"tag": "div"
}Overlay
{
"message": "You should use slots with <ContentRenderer>",
"value": null,
"excerpt": false,
"tag": "div"
}Popper
Use the popper prop to customize the popper instance.
Arrow
{
"message": "You should use slots with <ContentRenderer>",
"value": null,
"excerpt": false,
"tag": "div"
}Placement
{
"message": "You should use slots with <ContentRenderer>",
"value": null,
"excerpt": false,
"tag": "div"
}Offset
{
"message": "You should use slots with <ContentRenderer>",
"value": null,
"excerpt": false,
"tag": "div"
}Slots
panel
Use the #panel slot to fill the content of the panel. You will have access to the open property and the close method in the slot scope.
{
"message": "You should use slots with <ContentRenderer>",
"value": null,
"excerpt": false,
"tag": "div"
}Props
mode
"click" | "hover"
"click"ui
{ wrapper?: string; container?: string; trigger?: string; width?: string; background?: string; shadow?: string; rounded?: string; ring?: string; base?: string; transition?: DeepPartial<{ enterActiveClass: string; enterFromClass: string; enterToClass: string; leaveActiveClass: string; leaveFromClass: string; leaveToC...
{}popper
PopperOptions
{}openDelay
number
config.default.openDelaycloseDelay
number
config.default.closeDelaydisabled
boolean
falseopen
boolean
undefinedoverlay
boolean
falseConfig
{
"message": "You should use slots with <ContentRenderer>",
"value": null,
"excerpt": false,
"tag": "div"
}