vue-router

1. vue-router query 和 params 传参

query 传参: 
this.$router.push({ path:'/xxx' query:{ id:id } })
接收参数:
this.$route.query.id

params 传参:

this.$router.push({ name:'xxx' params:{ id:id }})
接收参数:
this.$route.params.id

总结：

1. 用params传参只能用name来引入路由，即push里面只能是name:’xxxx’,不能是path:’/xxx’,因为params只能用name来引入路由，如果这里写成了path，接收参数页面会是undefined！！！
2. 使用query传参使用path来引入路由。
3. params是路由的一部分,必须要在路由后面添加参数名。query是拼接在url后面的参数，没有也没关系。
4. 直白的来说query相当于get请求，页面跳转的时候，可以在地址栏看到请求参数，而params相当于post请求，参数不会再地址栏中显示。

2. this.$$ router 和 this.$route有何区别？

1. router.push方法
2. $route为当前router跳转对象，里面可以获取name、path、query、params等

3. 导航守卫

全局前置守卫：router.beforeEach((to, from, next) => { ... })
全局解析守卫：router.beforeResolve
全局后置钩子：router.afterEach((to, from, next) => { ... })
路由独享守卫：router.beforeEnter((to, from, next)) => { ... })
组件内的守卫：
· beforeRouteEnter
· beforeRouteUpdate
· beforeRouteLeave

4. 完整导航解析流程

1.导航被触发。
2.在失活的组件里调用 beforeRouteLeave 守卫。
3.调用全局的 beforeEach 守卫。
4.在重用的组件里调用 beforeRouteUpdate 守卫 (2.2+)。
5.在路由配置里调用 beforeEnter。
6.解析异步路由组件。
7.在被激活的组件里调用 beforeRouteEnter。
8.调用全局的 beforeResolve 守卫 (2.5+)。
9.导航被确认。
10.调用全局的 afterEach 钩子。
11.触发 DOM 更新。
12.调用 beforeRouteEnter 守卫中传给 next 的回调函数，创建好的组件实例会作为回调函数的参数传入。