Replies: 1 comment
-
Examples available for Vuetify2 and Vuetify3. Vuetify 2r"""
https://v2.vuetifyjs.com/en/components/tooltips/
<v-tooltip bottom>
<template v-slot:activator="{ on, attrs }">
<v-btn v-bind="attrs" v-on="on">
Hover over me
</v-btn>
</template>
<span>Tooltip</span>
</v-tooltip>
"""
from trame.app import get_server
from trame.ui.vuetify2 import VAppLayout
from trame.widgets import vuetify2, html
server = get_server()
server.client_type = "vue2"
with VAppLayout(server):
with vuetify2.VTooltip(bottom=True):
with vuetify2.Template(v_slot_activator="{ on, attrs }"):
vuetify2.VBtn("Hover over me", v_bind="attrs", v_on="on")
html.Span("Tooltip")
server.start(port=10002) Vuetify 3r"""
https://vuetifyjs.com/en/components/tooltips/
<v-tooltip text="Tooltip">
<template v-slot:activator="{ props }">
<v-btn v-bind="props">Hover over me</v-btn>
</template>
</v-tooltip>
"""
from trame.app import get_server
from trame.ui.vuetify3 import VAppLayout
from trame.widgets import vuetify3
server = get_server()
server.client_type = "vue3"
with VAppLayout(server):
with vuetify3.VTooltip(text="Tooltip"):
with vuetify3.Template(v_slot_activator="{ props }"):
vuetify3.VBtn("Hover over me", v_bind="props")
server.start(port=10003) |
Beta Was this translation helpful? Give feedback.
0 replies
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
-
I want to add VTooltip to realize the function of the tip box appearing when the mouse hovers over the VBtn, but there seems to be few code examples of VTooltip in the trame, so I'm not too clear about its use. Can you tell me how to modify this code to realize the function? Here is my code.
########code########
from trame.app import get_server
from trame.ui.vuetify import SinglePageLayout
from trame.widgets import vuetify
server = get_server()
with SinglePageLayout(server) as layout:
layout.title.set_text("VTooltip Test")
if name == "main":
server.start()
#######code##########
Please tell me how to add Vtooltip to these two lines of code, thanks a lot!
with vuetify.VBtn(color="primary", icon=True):
vuetify.VIcon("mdi-folder-open")
Beta Was this translation helpful? Give feedback.
All reactions