从 router-link linkActiveClass 到自己动态配置active class

每次路由切换成功进入激活状态

在点击导航栏的时候，让被点击的那一个有背景色，其他的没有背景色？

如何做？

在路由里面设置

const router = new VueRouter({
routes,
linkActiveClass: 'is-active'
});
1
2
3
4
linkActiveClass: 'is-active',
1
然后在css里面设置

.is-active{
background:red;
}
1
2
3
这样<router-link>被点击激活的时候就会被加上is-active这个class了。注意如果没有设置router-link的标签类型，会是<a>标签,<a>标签是没有宽度和高度的。那么我们需要设置成div。然后才会背景颜色的变化。