themesberg / flowbite

Open-source UI component library and front-end development framework based on Tailwind CSS
https://flowbite.com
MIT License
7.31k stars 710 forks source link

Tooltips rendered after `onMounted` aren't initializing #789

Closed jimmiejackson414 closed 5 days ago

jimmiejackson414 commented 5 months ago

Discussed in https://github.com/themesberg/flowbite/discussions/784

Originally posted by **jimmiejackson414** January 23, 2024 I have a Nuxt3 project that I'm currently implementing tooltips in. I have a side navigation bar that uses tooltips, and they work fine. I have a page where data is being loaded during the onMounted lifecycle from the backend, and so while that is being loaded, the page has a spinner inside of a `v-if`. Once the data loads into my store, the `v-else` triggers and the child components render to the page (including the tooltips). I believe that because the components render "late" in this way, the tooltips can't initialize properly. I've tried importing the `initTooltips` method from flowbite and setting a watcher on the data, so that once the data is loaded then I can initialize the tooltips, however this still doesn't work. Any ideas how I can get this to work? Here's the simplified version: **page.vue** ```vue ```
SaqibSyed1014 commented 2 months ago

facing same problem.

zoltanszogyenyi commented 5 days ago

Hey @SaqibSyed1014, @jimmiejackson414,

Please check our upgraded Nuxt guide using a composable:

https://flowbite.com/docs/getting-started/nuxt-js/#data-attributes

The starter repo template has also been updated:

https://github.com/themesberg/tailwind-nuxt-starter

Cheers, Zoltan