（已解决）什么是vue导航守卫

vue导航守卫是是一种Vue Router内置的功能，它可以让我们在路由切换的过程中执行自定义的代码逻辑。
举一个简单的例子：

import Vue from 'vue';
import Router from 'vue-router';

Vue.use(Router);

const router = new Router({
  // 路由配置...
});

// 全局前置导航守卫
router.beforeEach((to, from, next) => {
  // 获取当前用户的登录状态（这里仅作示例，实际项目中可能来自vuex或localStorage）
  let isLoggedIn = !!localStorage.getItem('userToken');

  if (to.meta.requiresAuth && !isLoggedIn) {
    // 判断目标路由是否要求认证（通过meta字段标记），若未登录则重定向到登录页面
    next({ path: '/login', query: { redirect: to.fullPath } });
  } else {
    // 用户已登录或目标路由无需认证，允许继续导航
    next();
  }
});

export default router;

在这个例子中，每当试图切换到一个设置了 requiresAuth: true 的路由时，导航守卫会先检查用户是否已经登录（通过检查localStorage中的token）。如果没有登录，它会阻止原本的跳转操作，并将用户重定向到登录页面。如果用户已登录，则放行，允许路由正常跳转。这就是Vue导航守卫在实际应用场景中起到的作用。