位置: IT常识 - 正文

解决router.beforeEach()动态加载路由出现死循环问题(解决掉发的有效方法)

编辑:rootadmin
这篇文章主要介绍了解决router.beforeEach()动态加载路由出现死循环问题,具有很好的参考价值,希望对大家有所帮助。如有错误或未考虑完全的地方,望不吝赐教 目录

推荐整理分享解决router.beforeEach()动态加载路由出现死循环问题(解决掉发的有效方法),希望有所帮助,仅作参考,欢迎阅读内容。

文章相关热门搜索词:解决的英文,解决的英文,解决口苦最快的方法,解决掉发的有效方法,解决口苦最快的方法,解决中暑最有效方法,解决烧心最快方法,解决的英文,内容如对您有帮助,希望把文章链接给更多的朋友!

router.beforeEach()动态加载路由出现死循环1、router.beforeEach( to , from ,next) 介绍2、两种死循环问题vue动态加载路由进入页面白屏或beforeEach死循环踩坑router.beforeEach()动态加载路由出现死循环

采用beforeEach做路由过滤,如果没登录就直接跳转到登录界面,然而发现个问题就是要么跳转到登录页面、然后再调回首页,要么卡着不动、要么出现空白页面。

1、router.beforeEach( to , from ,next) 介绍to: 即将路由的地址form: 当前的路由地址,也就是马上要离开的地址next(): 执行进入下一个路由next(false): 禁止进入下一个路由next('/login'): 路由到/login地址2、两种死循环问题

(1)路由到相同地址的死循环

比如在beforeEach中设置未登录(userData为null)就跳转到登录页面

在非登录页面是没有问题的,但是在登录页面就出现了死循环或者空白页,通过打印我们发现浏览器在登录页反复跳转。

在登录页面因为没登录,userData为null,这时候通过next(’\login’)就会重定向到登录页面,重定向到登录页面后,这时候userData依然为空,那么就要继续重定向登录页面,于是出现了死循环。

对这种情况加个判断条件就能解决。

解决router.beforeEach()动态加载路由出现死循环问题(解决掉发的有效方法)

(2)动态加载路由表出现的死循环

在beforeEach()通过动态加载路由表

在beforeEach()中都会获取路由表存入store,然后从store取出动态加入此路由表。

但是每次路由之前都会重新添加路由表,每次添加完路由表当前默认路径是首页(to.path显示内容)而不是登陆页面,页面会自动跳转到首页,但是如果这时候通过next(’/login’)跳转到登录页面,那么就会重新路由,在路由前又开始重新添加路由表,然后当前路径是首页,这时候又要跳转到登录页面因此就会出现死循环。

这时候我们就不能反复加载路由表,加个判断条件就行了。

vue动态加载路由进入页面白屏或beforeEach死循环踩坑

开发的哥们儿从网上找了一个简单的框架,通过auth的配置来决定什么权限可以进入到什么页面。具体操作就是登陆获取用户的权限,然后遍历本地的总路由表匹配权限返回当前用户可以访问的路由表。网上大多数的方案是从后端接口获取权限和路由表。此为两者之间的差异,但是不影响填坑方案的可行性

先放上本地总路由表部分代码,就是在这个表中根据权限进一步遍历筛选的,通过硬编码的方式写在项目中,auth[]内用数字、用中文、用单词也都是可以的

const routerList = [{path: '/',component: Layout,redirect: '/dashboard',auth: [0, 1, 2],meta: {title: '首页',icon: 'dashboard'},children: [{path: 'dashboard',name: 'Dashboard',component: () => import('@/views/dashboard/index'),meta: {title: '首页',icon: 'dashboard'},auth: [0, 1, 2]}]},{path: '/enterprises',component: Layout,name: 'Enterprises',redirect: 'noRedirect',auth: [0, 1, 2],meta: {title: '智慧园区',icon: 'el-icon-office-building'},children: [{path: 'huanjingjiance',name: 'huanjingjiance',component: () => import('@/views/environment/monitor'),auth: [0, 2],meta: {title: '环境监测'},}]},{path: '/user',component: Layout,name: 'User',redirect: 'noRedirect',auth: [0, 1],meta: {title: '人员信息',icon: 'el-icon-user'},children: [{path: 'index',name: 'Index',component: () => import('@/views/user/index'),meta: {title: '个人信息'},auth: [0, 1],}]}]

首先在路由中需要指定登录的页面,这个是不分权限的,所以不需要动态获取

const constantRoutes = [{path: '/login',component: () => import('@/views/login/index'),hidden: true},...dynamicRouter]var createRouter = () => new Router({mode: 'history',scrollBehavior: () => ({y: 0}),routes: constantRoutes})

以上为个人经验,希望能给大家一个参考,也希望大家多多支持本站。

本文链接地址:https://www.jiuchutong.com/zhishi/310505.html 转载请保留说明!

上一篇:dedecms织梦二次开发独立点赞功能(织梦可以放两个模板吗)

下一篇:mysql外键约束有什么要求(mysql外键约束的基本语法结构)

  • 普通发票税率1%要交税吗
  • 增值税票是什么
  • 房地产业如何确认收入
  • 汇算清缴税费怎么入账
  • 预缴税款什么时候可以手动填写申报表
  • 因技术原因淘汰的财产形成的损失需备案吗
  • 税控盘减免税有时间限制吗?
  • 业务招待费的进项怎么算
  • 稿酬所得是否需要按照累计预扣税率
  • 暂估出库是什么意思
  • 出口退税是按进项税额吗
  • 查土地补贴到啥单位查明
  • 挂靠费如何纳税?
  • 粮食仓储设施设备管理
  • 陈列费发票属于什么科目
  • 公司按月工资怎么算
  • 库存现金清查短款会计分录
  • 本月开了负数发票怎么开
  • 营改增步骤
  • 计征所得税会计分录怎么做?
  • 权益法核算下的顺流交易
  • win7取消共享文件夹
  • 三证合一后的税务登记证查询方法
  • 出口转内销发票抵扣
  • 代垫运费的会计处理
  • 外贸出口退税企业差旅费可以抵扣吗
  • uniapp 安卓原生
  • ChatGPT-4 终于来了(文末附免费体验地址)
  • 委托加工物资账务怎么做
  • ui.exe啥意思
  • 增值税税率调整为13%的文件
  • 人工智能时代如何培养孩子
  • php评论盖楼
  • 什么是非营利性养老机构
  • 新会计准则开办费如何做账务处理
  • 福利费入账要求
  • 背景渐变 css
  • 交易性金融资产入账价值怎么计算
  • python怎么求列表里的和
  • 端午节过节费发放通知
  • 列入固定资产的金额标准
  • 织梦cms要钱吗
  • 借款的帐务处理?
  • 小规模纳税人1%税率优惠政策
  • 长期股权投资大白话解释
  • 进口退货退税
  • 什么叫固定资产
  • 餐饮娱乐服务员
  • 已认证的红字发票怎么开
  • 借款收回的会计科目
  • 中标服务费可以税前扣除吗
  • 事业单位开办费与注册资本的关系
  • 提供劳务结转的成本计入什么科目
  • 结转增值税的账务处理一定要通过转出未交增值税吗
  • 个人垫付的费用如何向单位报销行政单位
  • 关于低值易耗品的评估说法正确的有()
  • 专用发票怎么网上申领
  • 农产品进项税额会计分录
  • 商业银行存款业务规则
  • 删除sql server2008
  • xp系统开机按什么还原
  • Mail.app增强插件:Universal Mailer介绍
  • linux介绍视频
  • bios是什么意思的
  • 2015微软发布会
  • mac win10 wifi
  • linux系统批量任务
  • linux基本使用
  • win7笔记本触摸板怎么用滑轮
  • win个性化设置没反应
  • macbook core2
  • 如何将windows 10
  • 公认的经典
  • js跨域请求json数据
  • 字符串中指定字符变换
  • win10文件类型选项
  • unity 形变
  • 国家税务总局青海省税务局
  • 卷烟批发环节的消费税一箱150元
  • 国税系统如何变更财务负责人
  • 免责声明:网站部分图片文字素材来源于网络,如有侵权,请及时告知,我们会第一时间删除,谢谢! 邮箱:opceo@qq.com

    鄂ICP备2023003026号

    网站地图: 企业信息 工商信息 财税知识 网络常识 编程技术

    友情链接: 武汉网站建设