持续创作，加速成长！这是我参与「掘金日新计划 · 10 月更文挑战」的第14天，点击查看活动详情juejin.cn/post/714765…
编程式导航
调用方法来切换组件
除了使用router-link创建a标签来定义导航链接，我们那还可以借助router的实例方法，通过编写代码来实现。
想要导航到不同的URL，则使用router.push方法。这个方法回想history栈添加一个新的记录，所以，当用户点击浏览器后退按钮时，则回到之前的URL。
当你点击router-link时。这个方法会在内部调用，所以说，点击<router-link ：to=“...”>等同于调用router.push(...)
示例如下：
下面router对象已经配置好了的，但是写的东西太多了,可以看上一个文章
该方法的参数可以是一个字符串路径，或者是一个描述地址的对象。例如：
字符串：
对象：
router.push()有历史记录
router.replace()没有历史记录
命名路由
路由组件里面的name属性，起名字在路由当行的时候用。如下：
注意 name的值不能重复
命名视图
router-view可以展示多个视图
上图实例中如果没有name的话默认是default。
- 上面示例的整体思路是：在根组件上通过一个点击事件触发方法，在该方法函数内部，进行跳转切换路由组件，通过this.$router.push/replace(路径)来进行切换。切换的页面展示通过router对象里的components对象里的键值对（自定义属性名和对应的路由组件）来设置。例如上面的例子，如果出口router-view的name的值只有left，namecomponents里面所有的right属性对应的组件都不会被展示出来。
重定向
类似于呼叫转移一样。通过redirect
也可以这样写：
别名
给同一个组件起了两个名字，访问的时候都是该组件（跟大名小名一样），通过在router对象里添加alias属性。
路由传参
- 动态路由参数params(前面讲了，上一章，通配符传值）
- query
- hash
都由$route来接收（但会造成强耦合）
通过query传值的（查询字段传值）：
hash/query传值的话router对象那不能有通配符
注意因为都是通过route来接收，而是用props来接收。因为它是最基础的传值方法。（以属性传值的方式进行传值）
进阶
导航守卫（重要）：
导航：表示卢有正在发生改变，就会有守卫来监听。（监听路由的改变）导航的改变触发一系列函数（像是路由的生命周期一样）。
全局前置守卫（任何一个组件都会触发）：
是一个方法 router对象上的方法。router.beforeEach()
作用：当一个当行触发时，全局前置守卫按照创建顺序调用。守卫是异步解析执行，此时导航在所有守卫resolve玩之前一致处于等待中。在路由组件渲染之前。
接收三个参数：
- to：即将进入目标的路由对象，要打开的那个路由对象
- from：离开的那个路由对象
- next：实际上是一个方法，一定要调用这个方法，用于说明这个方法执行完了，可以往下执行。否则会卡住不动。可以直接next（）表示继续往下执行。next（false）表示中断当前导航，停在这。下一个路由组件打不开，停在from这个组件（比如：登录组件，可以在此时做判断，如果登陆成功就跳转，如果没成功阻止跳转）。next（‘路径’）类似于重定向，会直接切换组件。
全局解析守卫：很少用。在所有组件内守卫和异步路由组件被解析之后，他才会调用。
全局后置钩子：在组件已经渲染之后触发的。afterEach()
路由独享守卫：某个路由独享的守卫。
组件内的守卫：可以在路由组件内直接定义以下路由导航守卫
beforeRouteEnter:渲染真实DOM之前会触发。
beforeRouteUpdate：更新的时候触发，在当前路由改变，但是该组件被复用时调用。监听路由传值变化。除了watch的监听方法。
beforeRouteLeave:离开时触发。
区别。所有的全局守卫使用与所有组件。任何一个路由的变化都会导致全局钩子函数的触发。独享守卫只针对于某一个或某几个路由组件。组件内的守卫是路由组件都渲染完毕了，守卫开始执行，也是针对于某一个组件的
