How to VueJS router-link active style

Question

My page currently has Navigation.vue component. I want to make the each navigation hover and active. The \'hover\' works but \'active\' doesn\'t.

This is how Na

Answer 1

As mentioned above by @Ricky vue-router automatically applies two active classes, .router-link-active and .router-link-exact-active, to the component.

So, to change active link css use:

.router-link-exact-active{
 //your desired design when link is clicked
font-weight: 700;
}