vue开发客户端------token失效路由跳转到登陆页

客户端token失效的情况下,点击其他路由要自动跳转到登陆页

实现方式: 在路由文件router/index.js文件下面的登录路由中添加一个对公的条件,然后在beforeEach钩子函数中添加条件判断条件:

// 登录的路由中添加对公的条件
  {
    path: "/",
    redirect: "/login",
  },{
    path: "/login",
    name: "login",
    component: () => import("../views/login"),
    meta: { isPublic: true },
  },...

// 按照路由是否公开,来处理路由的动作
router.beforeEach((to, from, next) => {
  //如果不是可公开的路由并且当前没有token,那么要跳转到登陆页
  if (!to.meta.isPublic && !sessionStorage.getItem("token")) {
    next("/");
  }
  next();
});