Get 2024 Templates Mega Bundle!$1000 worth of 19 Bootstrap HTML, Vue & React Templates + 3 Vector Sets for just $99
Get for 99$

Accordions and pop up menus not working


Hi,
In the Good – Bootstrap 5 HTML Admin Dashboard template, I was implementing it in my NuxtJS SPA project. I initialized the required global styles and javascripts but for some reason the menu accordion for light sidebar layout isnt working.. I also tried different layout like the mini sidebar but the hover menu pop up isnt showing either. The html version is working though but not the spa version.


Text formatting options
Submit
Here's a how to add some HTML formatting to your comment:
  • <pre></pre> for JS codes block
  • <pre lang="html"></pre> for HTML code block
  • <pre lang="scss"></pre> for SCSS code block
  • <pre lang="php"></pre> for PHP code block
  • <code></code> for single line of code
  • <strong></strong> to make things bold
  • <em></em> to emphasize
  • <ul><li></li></ul>  to make list
  • <ol><li></li></ol>  to make ordered list
  • <h3></h3> to make headings
  • <a></a> for links
  • <img> to paste in an image
  • <blockquote></blockquote> to quote somebody
  • happy  :)
  • shocked  :|
  • sad  :(

Replies (3)


Hi,

We are initializing our components in the page load event, this will work in the HTML version since pages are reloaded but in the SPA page is loaded once.

Instead of initializing a component once on page load, you need to move initialization methods into your vue components. You can call init functions in vue mounted function.



Thanks for the reply. Do you have the list of the init functions that I need to call? Or do I have to call all the components _init() functions that Im going to need? Is there a one giant init() that I can use to initialize all the components in the scripts.bundle.js?



Unfortunately, we do not have one init function, you can refer to the init part in our js files.

All files which you need to initialize will have a init function with a page load event, you can move an initialization into your component.

For layuot to work correctly you should initillze all files from js/components and js/layout. Other js files are not mendtory and you can init them separatly for your pages/components.


Text formatting options
Submit
Here's a how to add some HTML formatting to your comment:
  • <pre></pre> for JS codes block
  • <pre lang="html"></pre> for HTML code block
  • <pre lang="scss"></pre> for SCSS code block
  • <pre lang="php"></pre> for PHP code block
  • <code></code> for single line of code
  • <strong></strong> to make things bold
  • <em></em> to emphasize
  • <ul><li></li></ul>  to make list
  • <ol><li></li></ol>  to make ordered list
  • <h3></h3> to make headings
  • <a></a> for links
  • <img> to paste in an image
  • <blockquote></blockquote> to quote somebody
  • happy  :)
  • shocked  :|
  • sad  :(
Text formatting options
Submit
Here's a how to add some HTML formatting to your comment:
  • <pre></pre> for JS codes block
  • <pre lang="html"></pre> for HTML code block
  • <pre lang="scss"></pre> for SCSS code block
  • <pre lang="php"></pre> for PHP code block
  • <code></code> for single line of code
  • <strong></strong> to make things bold
  • <em></em> to emphasize
  • <ul><li></li></ul>  to make list
  • <ol><li></li></ol>  to make ordered list
  • <h3></h3> to make headings
  • <a></a> for links
  • <img> to paste in an image
  • <blockquote></blockquote> to quote somebody
  • happy  :)
  • shocked  :|
  • sad  :(