router-link的属性：

router-link的属性：

（1）属性to：用于指定跳转的路径

to后边跟上你配置好的路径

<router-link to="/home">首页</router-link>

（2）属性tag：

router-link默认会将链接渲染成a标签，如果你想让它渲染成其他的，可以通过tag属性

<router-link to="/home" tag="button">首页</router-link>

<router-link to="/home" tag="li">首页</router-link>

（3）属性replace

router-link默认标签可以返回，如果不希望有返回键，可以添加replace，不需要跟值

<router-link to="/home" replace>首页</router-link>

（4）修改默认控制激活样式active-class

router-link标签会被渲染成以下形式：

<button  class="router-exact-active    router-link-active">

router-link-active就是用来控制激活的样式，你可以直接运用这个class名称修改

<style>
.router-link-active {
  color: red;
}
</style>

如果你觉得这个名字太长了，可以通过属性active-class指定样式的名称

<router-link to="/home" replace active-class="active">首页</router-link>

<router-link to="/about" replace active-class="active">首页</router-link>



<style>
.active {
  color: red;
}
</style>

假如标签很多，有这样的简便方式：

在router-index.js中这样配置就可以了

const router = new VueRouter({
  routes,
  activeClass: 'active'
})