Estoy usando la librería https://github.com/vuetifyjs/vuetify en un proyecto que estoy realizando, pero al intentar añadirle un tooltip a un botón que es el activador de un menú, no funciona el tooltip. Me imagino que sea por los slots.
Este es un ejemplo del tooltip funcionando perfectamente.
<v-tooltip bottom>
<v-btn
slot="activator"
color="secondary"
dark
small
flat
>
Secundario - {{ stheme }}
</v-btn>
<span>Color Secundario</span>
</v-tooltip>
Ahora esto es lo que que tengo en mi codigo actualmente:
<v-menu offset-y>
<v-tooltip bottom>
<v-btn
slot="activator"
color="secondary"
dark
small
flat
>
Secundario - {{ stheme }}
</v-btn>
<span>Color Secundario</span>
</v-tooltip>
<v-list>
<v-list-tile
v-for="(item, index) in themes"
:key="index"
@click="changeTheme(item, false)"
>
<v-list-tile-title>{{ item.name }}</v-list-tile-title>
</v-list-tile>
</v-list>
</v-menu>
Cuando no tenia el tooltip el codigo se veia de esta manera:
<v-menu offset-y dense>
<v-btn
slot="activator"
color="secondary"
dark
small
flat
>
Secundario - {{ stheme }}
</v-btn>
<v-list>
<v-list-tile
v-for="(item, index) in themes"
:key="index"
@click="changeTheme(item, false)"
>
<v-list-tile-title>{{ item.name }}</v-list-tile-title>
</v-list-tile>
</v-list>
</v-menu>
Este es un link de la documentación de vuetify donde pueden ver como se agrega un menú a un v-btn https://vuetifyjs.com/es-MX/components/menus
La idea que me hago es que antes del tooltip yo establecia el v-btn
con el slot="activator"
y como estaba dentro del elemento menu
, este pasaba a ser el que activaba el menu al hacer click, pero al estar ahora dentro de un tooltip
no sabe cual es el que debe desencadenar esta acción. Si le pongo al tooltip
slot="activator"
no funciona tampoco. Que podra hacer para que me funcione el tooltip
y a la vez me muestre el menu al hacer click sobre el botón
. No quisiera hacer un dialog. Que me recomendarian????