search

themesberg / flowbite

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

Drawer not work in nextJs #655

Closed vinayiaastha closed 7 months ago

vinayiaastha commented 11 months ago

Drawer not working: I am using the drawer in NextJS but it is not working on clicking the button, I think the data-drawer property does not work, please give me a solution or any alternative to use these.

image

Documents link: https://flowbite.com/docs/components/drawer/#drawer-navigation

Screenshots image

rlongre commented 11 months ago

You haven't given enough information for anyone to suggest anything definitive. Please include code that shows how you're loading the JS/TS file, if, where, and when you're calling initFlowbite(), and where and when you're adding the drawer template to the DOM.

Without seeing your code, my best guess, assuming you've done all else properly, is that you might be adding the drawer template to the DOM after the Flowbite library has already initialized. In that case, your drawer won't exist when the library tries to detect the data- attributes so it won't know your drawer exists. If it doesn't know it exists, it can't attach the event handlers needed to give it the behavior you expect.

To offer anything better than a guess, you'd have to share some meaningful code.

zoltanszogyenyi commented 7 months ago

Thanks for the answer @rlongre.

Besides, for Next.js and React we will develop a custom drawer component from Flowbite React.