vue-router的导航钩子

vue-router中有7个钩子函数，主要分3类：

全局钩子

前置守卫：router.beforeEach；

后置守卫：router.afterEach；

全局解析守卫：router.beforeResolve；

注意：全局解析守卫（router.beforeResolve）是在所有组件内守卫和异步路由组件被解析之后（导航被确认之前）调用。

路由独享钩子

路由独享钩子：单个路由独享的导航钩子，是在路由配置上直接定义的。

beforeEnter（路由独享守卫）；

const router = new VueRouter({
  routes: [
    {
      path: "/setting",
      component: () => import("@/components/setting.vue"),
      beforeEnter: (to, from, next) => {
        console.log("beforeEnter");
        // do something
        next();
      },
    },
  ],
});

钩子函数有三个参数：to、from、next（）

to：router即将进入的路由对象；

from：当前导航即将离开的路由；

next（）：是一个function࿰