The New Way to Build! Introducing ReUI — the developer platform for agentic UI with shadcn/ui
Learn More

Components freeze after Livewire Navigate


i'am using metronic 8.2.3 demo 39
when i click menu with attribute wire:navigate
dropdown menu in sidebar and header such as notification, profile can't click or show
how can i fix it ?

i have watch this:


this is my sidebar :
Sidebar Code

this is my javascript :

<script>
document.addEventListener('DOMContentLoaded', () => {
console.log('dom loaded');
});
document.addEventListener('livewire:navigated', () => {
console.log('navigated');
KTComponents.init()
KTMenu.init();
})
document.addEventListener("livewire:load", function () {
Livewire.on("mount", function () {
KTMenu.init();
});
});
</script>


Text formatting options
Submit
Click any option to insert into your comment. Select text first to wrap it.
  • **text** to make things bold
  • *text* to emphasize
  • ### Heading to make headings
  • [link text](url) for links
  • ![alt text](image-url) to paste in an image
  • - item to make a list
  • 1. item to make an ordered list
  • > quote to quote somebody
  • `code` for single line of code
  • ```js ... ``` for JS code block
  • ```html ... ``` for HTML code block
  • ```scss ... ``` for SCSS code block
  • ```php ... ``` for PHP code block
  • --- for a horizontal rule
  • happy  :)
  • shocked  :|
  • sad  :(

Replies (6)


Great solution! I hope this can help others facing similar issues as well.



I'm glad that you were able to resolve the issue! Your solution could be helpful for others facing similar issues. If you have any more questions or need further assistance, please don't hesitate to ask.

May I know, how you add data-navigate-once to the script?



i have fix this issue
you can close this ticket

i have add data-navigate-once to script

and also add this code

document.addEventListener('livewire:navigated', () => {
KTMenu.init = function () {
KTMenu.createInstances();

KTMenu.initHandlers();
};
KTMenu.init();
});



It's worked for me, But still get this error message.

Uncaught SyntaxError: Failed to execute 'replaceWith' on 'Element': Identifier 'defaultThemeMode' has already been declared


Text formatting options
Submit
Click any option to insert into your comment. Select text first to wrap it.
  • **text** to make things bold
  • *text* to emphasize
  • ### Heading to make headings
  • [link text](url) for links
  • ![alt text](image-url) to paste in an image
  • - item to make a list
  • 1. item to make an ordered list
  • > quote to quote somebody
  • `code` for single line of code
  • ```js ... ``` for JS code block
  • ```html ... ``` for HTML code block
  • ```scss ... ``` for SCSS code block
  • ```php ... ``` for PHP code block
  • --- for a horizontal rule
  • happy  :)
  • shocked  :|
  • sad  :(
Text formatting options
Submit
Click any option to insert into your comment. Select text first to wrap it.
  • **text** to make things bold
  • *text* to emphasize
  • ### Heading to make headings
  • [link text](url) for links
  • ![alt text](image-url) to paste in an image
  • - item to make a list
  • 1. item to make an ordered list
  • > quote to quote somebody
  • `code` for single line of code
  • ```js ... ``` for JS code block
  • ```html ... ``` for HTML code block
  • ```scss ... ``` for SCSS code block
  • ```php ... ``` for PHP code block
  • --- for a horizontal rule
  • happy  :)
  • shocked  :|
  • sad  :(