开发者学堂课程【Vue.js 入门与实战：路由-设置选中路由高亮的两种方式】学习笔记，与课程紧密联系，让用户快速学习知识。
课程地址：https://developer.aliyun.com/learning/course/586/detail/8195
路由-设置选中路由高亮的两种方式
有时路由相关的链接，如果当前展示的是登录，最好是把登录按钮高亮一下，这个需求经常会出现。例如，经常使用的一些手机 app，界面最下方会有一个 tap 栏，当选中其中的一些按钮时，会有高亮提示。如果想要达到这个效果，首先需要观察网页：
对 router-link-active 设置样式，这样在切换的时候，就可以进行显示。对字体的设置，代码如下：
<style>
router - link - active {
color:red ;
font-weight: 800;
font-style: italic ;
font- size :80px;
text-decoration: underline ;
}
</Stvl1e>
结果如下，前端网页：
此时再添加一下背景颜色，通过以下代码：
background-color : green；
通过查看 router-link 的 api，可以了解到：
有时候想要 渲染成某种标签，例如
- 于是我们使用 tag prop 类指定何种标签，同样它还是会监听点击，触发导航。
<router-link to=" /foo" tag="l1" >foo</router-link>
<!--渲染结果-->
<li>f0o</li>
第二种方式：
Active-class
类型：stiring
默认值：“router-link-active”
此时如果想要修改被激活的路由连接的默认类， 那么设置链接激活时使用的 CSS 类名。
默认值可以通过路由的构造选项 linkActiveClass 来全局配置。
代码：
var routerObj = new VueRouter ( {
// route
//这个配置对象中的route表示[路由匹配规则] 的意思
routes: [ //路由匹配规则
],
linkActiveClass:， myactive，
})
此时改完刷新后网页不再显示高亮。
总结：
这就是实现路由高亮的两个方式。第一种，使用默认的提供的类名，第二种，通过 vue.router 传递一个属性，进而自己定义。
