路由守卫：

全局守卫：juejin.cn/post/714324…

路由独享的守卫：

路由独享的守卫 beforeEnter(to,from,next)，路由初始化(组件未初始化)----

a，路由鉴权-----用户体验：界面，功能，bug，效率，权限

b，组件异步加载情景中(插件配置：syntax-dynamic-import)

在router.index.js文件中：

routes:[{
    path:"/test",
    component:()=>import("../components/Test.vue"),
    //路由独享的守卫：
    beforeEnter(to,from,next){
        if(to.path==="/test"){
          alert("请登录");
          // 禁止跳转到组件
          next(false); 
        }else{
          next()
        }
    }
}]

组件内部生命周期守卫（钩子函数）：在组件内操作

1.beforeRouteLeave 从该组件离开

2.beforeRouteEnter(to,from,next)，组件被激活，使用不了 this，故构造指定该 next 可以接收一个回调函数接收当前vm 实例----路由传参获取参数，得到初始化数据

3.beforeRouteUpdate(to,from,next)，组件重用时被调用----路由传参获取参数，避免增添 watch 开销

补充：

导航守卫执行顺序：beforeRouteLeave < beforeEach < beforeRouteUpdate < beforeEnter < beforeRouteEnter < beforeResolve < afterEach

出发路由，预备从当前组件离开，判断路由变化，判断组件是否重用，判断新路由初始化，判断组件初始化，路由与组件初始化完毕，路由组件重定向完毕