How to integrate into a sidebar nav/menu?

[rezaffm]

Hello,

I quite seldom ask questions as I, for some reason, enjoy the pain to figure out things myself.

This one tough is not solvable for me, even after wasted hours. I finally use a css solution now but I'd still like to understand where I am heading wrong or what's going on ?

What I tried to achieve:

So I came across this tutorial here (Nr.2):

• https://bootstrapious.com/p/bootstrap-sidebar
• https://bootstrapious.com/tutorial/sidebar/index2.html

The guy there mentions he used perfect scrollbar (he used a jquery plugin). So I am more a vue guy and then I found your (great!) package. All good. Easy to install and to integrate.

Then, the strangeness started to begin.

• Sometimes the scrollbar is on the left or on the right side, I cannot tell if there is any relation or not.
• Also the sidebar is hidden by default on responsive devices. After I integrated perfect scrollbar, you can see the navbar bouncing/dancing when you first load the page.

What I tried:

• I tried to use perfect scrollbar directly, without success. I ended up in the nightmare that the scrollbar would not be there if the scrollbar is hidden initially (it is still in the DOM tough), I think that's expected behavior and needs to be solved by the update function
• Also I tried to only init the scrollbar if the sidebar is toggled, it was a mess
• I tried a pure JS approach, even excluding Vue, same story

For your convenience, I also setup a repo https://github.com/rezaffm/scrollbar-sidenav It's a laravel project, so you can run it by composer install, npm install, npm run watch (or dev).

I'd highly appreciate to understand or see a solution that would get this plugin integrated with vue for a sidebar navigation (just as the guy has done it with jquery).

I was quite negatively surprised that this would be such a huge issue, should have maybe asked a bit earlier for some help.

[rezaffm]

closed as apparently not relevant.