Super Sale Limited Time 50% OFF for All-Access Plans
Save 50% Now

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
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 (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
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  :(