vue-router

一： 使用路由
引入组件
配置路由
创建路由实例
创建Vue实例，挂载路由
二： 两个标签
（1）
路由出口
路由匹配到的组件将渲染在这里
（2）
使用 router-link 组件来导航.，通过传入 to 属性指定链接 ， 默认会被渲染成一个 标签

三： 两个属性
this.$router 全局路由对象，用来跳转
this.$route 当前页面路由信息
四：路由操作Api
路由跳转
（1） 通过路径跳转
this.$router.push({path:'/message', query:{x:1,y:2}}) （query传参显示）
（2）通过路由name跳转
this.$router.push({name:'Shopping', params:{a:3,b:4}}); （params传参隐藏）
路由回退 back() 回到上一页
路由前进 forward() 去往下一页
路由替换并不加入历史记录 replace()
路由任意跳转 go(index)，去到相对当前页面的index页面
五：嵌套路由
声明在路由的children属性里，并在组件中添加router-view标签
命名路由
配置路由的时候增加name属性，可以通过push({name, params})的方式跳转
动态匹配路由
型如：/index/:id?,通过this.$route.params.id获取，?表示id参数可传可不传

六： 路由懒加载

1.png

2.png