静态路由实例

1.最简单的例子

html页面

注意：自定义 js 文件需要放在<div id = 'app'>之后引入，否则会报 自定义js文件中 ‘#app’ 不存在。

js文件

注意：‘new Vue’ 和 ‘new VueRouter’ 中 v 需要大写

2.静态路由 & 编程式导航

http://www.cnblogs.com/wisewrong/p/6277262.html

html页面

注意：<button> 为编程式导航方式。

js文件

注意：$router.push 是为 history 添加一个新的记录。刚开始的做法是在 app 之外使用router.push({path:'/view-b'},{path:'/view-a'}),后来分析这种做法不对。router.push应该每次只能为history添加一个记录。该想法需要后期验证。

3.路由命名

html页面

注意：html 页面 <router-link> 中 to 前面需要添加 ‘：’，否则会出现点击路由，切换时，路由为..../{name:' aaa ' }的错误状态。

js文件

注意当路由需要传进去参数时：

html页面

注意：params为对象，写法为params{id：‘123’ }

js文件

注意：框出来的部分的写法。