原文地址：http://www.kssfeng.com/content/3c4f69611fa311e9a181525400cc6d13
我们经常会遇到这样的一个需求，
<ul>
<li><router-link to="/">网站首页</router-link></li>
<li><router-link to="/aboutmepage">关于我</router-link></li>
<li><router-link v-bind:class="{elHidden:roleName=='admin'?false:true}" to="/manage">网站管理</router-link></li>
<li><router-link v-bind:class="{elHidden:!isLogin}" to="/perinfo/article">个人中心</router-link></li>
</ul>
当点击上边类似tab的某一项的时候给它设置一个单独的激活css。
这时激活router-link需要用到他的active-class属性，他的默认值时router-link-active
这是css可以这样写：
a.router-link-active,nav li a:hover {
display: block;
background: #C93282;
color: #fff;
border-radius: 0 20px;
text-shadow: none
}
这样就可以实现点击时候激活一个与众不同的css但是现在的写法存在一个问题，那就是无论你点击哪一个的时候
<li><router-link to="/" exact>网站首页</router-link></li>都被激活了，原因在于无论哪个项中都包含了'/'
这时就需要用到exact属性了 写法如下：
<ul>
<li><router-link to="/" exact>网站首页</router-link></li>
<li><router-link to="/aboutmepage">关于我</router-link></li>
<li><router-link v-bind:class="{elHidden:roleName=='admin'?false:true}" to="/manage">网站管理</router-link></li>
<li><router-link v-bind:class="{elHidden:!isLogin}" to="/perinfo/article">个人中心</router-link></li>
</ul>
exact使'/'仅且只能时'/'时css激活。
