在main.js文件中，我们使用createRouter方法来创建路由实例，此路由实例可以使用beforeEach来注册全局的前置导航守卫。每当触发导航跳转时，都会被此导航守卫捕获。示例如下：
当一个导航触发时，全局前置守卫按照创建顺序调用。守卫是异步解析执行，此时导航在所有守卫 resolve 完之前一直处于等待中。
每个守卫方法接收两个参数：to: 即将要跳转到的路由对象；from: 当前导航将要离开的路由对象。
若注册的beforeEach方法返回的是布尔值时，其用来决定是否允许此次导航跳转。如以下代码，所有路由跳转都将被禁止。
router.beforeEach(async (to, from) => {
Return false;
}
更多时候，我们会在beforeEach方法中返回一个路由配置对象来决定要跳转的页面。这种方式更加灵活，如：
router.beforeEach(async (to, from) => {
If(to.name!= ‘setting’) {return {name:’setting’}}
}
可选的第三个参数 next。由于在导航守卫确认通过前，新的组件还没有被创建，此时若想使用当前组件实例处理一些逻辑，则可以通过next参数注册回调方法。如图：
在beforeRouteUpdate和beforeRouteLeave方法中可以直接使用this关键字来获取当前组件实例，无需额外的操作。
上一篇： 超出显示省略号
下一篇： 利用迅睿cms做一个选项卡切换（上）
