modest adder
I am experiencing difficulty maintaining the state of an open and closed menu. I am using DaisyUI and TailwindCSS. In the Astro <script> tag, I am receiving a toggle event. However, I am unable to manage the state of isOpen without refreshing the entire page. How can I achieve this?
I have attached a TypeScript file containing the code.
FYI: I'm using Astro + Svelte
main lynx
Astro runs on the server, not in the client like you might be used to with frontend frameworks
As such, it's not possible to update isOpen at runtime and for the page to change, the HTML has already been generated that way
What you should do instead is manage isOpen exclusively in your script tag
modest adder
I tried to manage it in script tag in astro file, but what happened when I click on navigation item then that script will be not executing, it's executing only once
delicate blaze
Are you using is:inline on your script tag? If not, the scripts are only executed once. If you are using view transitions, you might also need to add data-astro-rerun to re-execute the script after every transition.
You might want to take a look at the opting out of processing and script re-execution from the docs
wispy canopy
If you are already using svelte, why not just make the menu an island and handle it all with svelte?
modest adder
Are you using `is:inline` on your script tag? If not, the scripts are only execu...
I tried to use it, but doesn't worked.
modest adder
If you are already using svelte, why not just make the menu an island and handle...
Despite my efforts to utilize Svelte, I encountered an issue where the menu(nav) exhibited flickering behavior.