{ const ...-DPDK中文网" />

ZBLOG

// 路由鉴权(对应条件下访问不同路由) import router from "./router"; // 引入用户仓库 import { useUserStore } from "@/store"; // // 引入进度条插件和样式 import NProgress from 'nprogress' import 'nprogress/nprogress.css' // 全局前置守卫 router.beforeEach((to, from, next) => { const ...

根据你提供的代码和错误信息,问题出在路由导航守卫的逻辑上。具体来说,当用户未登录(没有 token)时,你将用户重定向到 /login 页面。然而,如果该页面也有某种逻辑会导致再次触发这个守卫,就会形成无限重定向。

解决方案

  1. 检查是否是目标路由:在重定向之前,应检查当前路径是否已经是 /login,如果是,则不要再执行重定向。这样可以防止循环重定向的问题。

  2. 示例代码修正

// 路由鉴权(对应条件下访问不同路由)
import router from "./router";
// 引入用户仓库
import { useUserStore } from "@/store";
// 引入进度条插件和样式
import NProgress from 'nprogress';
import 'nprogress/nprogress.css';

// 全局前置守卫
router.beforeEach((to, from, next) => {
    const userStore = useUserStore();
    // 开启进度条
    NProgress.start();
    
    if (userStore.token) {
        // 存在token
        if (to.path === '/login') {
            // 在有token的情况下访问登录页
            next('/'); // 中止到首页
            // 结束进度条
            NProgress.done();
        } else {
            next(); // 正常继续访问目标路由
        }
    } else {
        // 没有token则跳转到登录页,避免无限重定向到/login
        if (to.path !== '/login') {
            next('/login');
        } else {
            next(); // 如果已经是在/login,不做任何事情继续留在此路由。
        }
        
        NProgress.done();
    }
});

// 全局后置守卫
router.afterEach((to, from) => {
    NProgress.done();
});

主要修改点:

  • 在判断 else 分支中增加了一个检查:只有当目标路径不为 /login 时才执行 next('/login'),这能有效防止循环重定向。

确保在你的应用程序中,这样的逻辑能正确处理认证状态,从而避免引发无限重定向的情况。


内容由零声教学AI助手提供,问题来源于学员提问

本站部分文章来源于网络,版权归原作者所有,如有侵权请联系站长删除。
转载请注明出处: { const ...">http://sdn.0voice.com/?id=6824

分享:
扫描分享到社交APP
{ const ...&appkey=&pic=&searchPic=true")' title="分享到新浪微博" class="weibo"> { const ...")' title="分享到QQ好友" class="qq"> { const ...")' title="分享到QQ空间" class="qqzone">
上一篇
下一篇
发表列表
游客 游客
此处应有掌声~
评论列表

还没有评论,快来说点什么吧~

联系我们

在线咨询: 点击这里给我发消息

微信号:3007537140

上班时间: 10:30-22:30

关注我们
x

注册

已经有帐号?