Vue Router

中自动Vue Routwer的基本使用：

整体大概图：

 

详细介绍：

1.安装 vue-router 路由模块

2.创建一个路由对象，当导入vue-router包之后，在Window全局对象中， 就暴露出一个路由的构造函数（VueRouter）

3.将路由规则对象注册到vm实例上，用来监听URL的变化，然后展示对应的组件。

4.div中，写上 <router-view></router-view>来占位。

5.1 通过a标签加入超链接进行导航（注意一定要有# ：href=“#/  ___才行”）（不推荐）

5.2 通过router-link标签加入超链接进行导航（推荐）

 6. redirect 重定向url中的默认hash。

7.1 router-link-active 高亮显示当前展示选项。

　　方法一：

　　因为vue-router 中，选中的标签自动会添加个 router-link-active 属性，所以，我们只要设置下 router-link-active 的样式就OK了。

7.2 方法二：

　　通过在构造函数 new VueRouter 构造的时候， 添加 linkActiveClass：“ ” 选项来设置链接激活时使用的CSS类名。

　　官网文档介绍如下：

 

 　　手动添加选项：

　　设置 自定义的 myactive 类样式：

8. 过渡的动画：