arielsalminen / vue-design-system

An open source tool for building UI Design Systems with Vue.js
https://vueds.com
MIT License
2.17k stars 223 forks source link

Sidebar nav link issues - multiple click handlers and 3rd level+ nav items #177

Open lukenofurther opened 5 years ago

lukenofurther commented 5 years ago

Hi,

I've discovered a couple of issues with sidebar nav links in the docs build and have implemented fixes for both on a fork.

Firstly, as you click on links in the nav, the click handlers aren't removed from the nav links, meaning that multiple click handlers build up on each link. You can see this if you put a break point in the activeNav click method. The first time the click handler is called once, the second time twice, and so on. Click handler removal is supposed to happen on line ~72 of the activeNav component.

Secondly, nav items that are greater than 2 levels deep in the nav tree don't work because the click handler doesn't add the vueds-active class to their grandparents.

The commits on my fork branch fix the click handlers thing and adds recursive code that should mean the nav can handle any depth of nav item.

Shall I make a pull request?

lukenofurther commented 5 years ago

I just added a missing change to the branch on my fork, so it should be working fully now

alex-belyaev commented 4 years ago

got similar problem after updating to 3.24.2. Tried your fix, it resolves multiple eventlisteners but i still see that vueds-active calss was not added at the first click. So currently your fix doesn't work for me.