router-link 设置链接激活时使用的 CSS 高亮

active-class

类型: string

默认值: “router-link-active”

设置 链接激活时使用的 CSS 类名。默认值可以通过路由的构造选项 linkActiveClass 来全局配置。

HTML:

<div class="sidebar">
<router-link to="/user/menuList" tag="div" >
<div class="tab-link">标签一</div>
</router-link>
<router-link to="/user/home">
<div class="tab-link">标签二</div>
</router-link>
</div>
//有时候想要 <router-link> 渲染成某种标签，例如 <li>。 于是我们使用 tag 类指定何种标签，同样它还是会监听点击，触发导航。

CSS:

.sidebar div{
height: 50px;
line-height: 50px;
text-align: center;
border: solid pink 1px;
}
.router-link-active .tab-link{ //.router-link-active 指定
color: red;
background:pink;
}