qiankun 与vue-router 不兼容导致路由显示 undefined 问题

news2024/11/16 3:22:06

在路由前置守卫中监听 to 及 from 的变化,发现 router.push 跳转路由时,会发现打印出 两次以上的 to、form 对象,只有第一次打印的from对象是正确的,而后两次都是由于 qiankun 与vue-router 不兼容引起的路由守卫重复执行的问题导致的,当重复执行三次以上时,用户点击浏览器左上角的回退按钮会出现路由显示undefined,导致页面404不展示

 

 解决方法:使用 window.history.pushState() 代替 router.push() 方法

//打包后 import.meta.env.PROD 在生产环境为true
     if (import.meta.env.PROD) {
        window.history.pushState(
          null,
          null,
          `/system/suan-ni/taskDetail?taskId=${val.taskId}&taskName=${val.taskName}`
        )
      } else {
        router.push({
          path: "/taskDetail",
          query: {
            taskId: val.taskId,
            taskName: val.taskName
          }
        })
      }

参考:主应用和子应用都是用Vue3+VueRouter4,点击主应用中菜单进行router.push,对应同一个activeRule的子应用来回切换,会重复创建子应用实例

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.coloradmin.cn/o/739363.html

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈,一经查实,立即删除!

相关文章

CSS word-break 详解

word-break:normal 使用浏览器默认的换行规则 <!DOCTYPE html> <html> <head> <style> p.test1 { width:11em; border:1px solid #000000; word-break:normal; } </style> </head> <body> <p class"test1">This …

构建WebRTC技术需要的后端服务

&#x1f4e2;欢迎点赞 &#xff1a;&#x1f44d; 收藏 ⭐留言 &#x1f4dd; 如有错误敬请指正&#xff0c;赐人玫瑰&#xff0c;手留余香&#xff01;&#x1f4e2;本文作者&#xff1a;由webmote 原创&#x1f4e2;作者格言&#xff1a;新的征程&#xff0c;我们面对的不是…

【C语言】三子棋----详解

目录 前言 一、游戏规则 二、创建文件 1.test.c文件 &#x1f604;菜单函数的实现 &#x1f604;main函数的实现 &#x1f604;game游戏函数的实现 2.game.c文件 &#x1f604;书写初始化棋盘的函数&#xff1a; &#x1f604;书写打印棋盘的函数 &#x1f604;书写玩家…

iSCSI磁盘配置

iSCSI磁盘简要描述 iSCSI&#xff08;Internet Small Computer System Interface&#xff09;&#xff0c;Internet小型计算机系统接口&#xff0c;又称为IP-SAN&#xff0c;是一种基于因特网及SCSI-3协议下的存储技术。 iSCSI 可以与任意类型的 SCSI 设备进行通信。对于一个…

【阿里巴巴1688API接口开发系列】数据采集获取,封装接口可加高并发,大数据中心项目

首先以1688商品数据为例 item_get-获得1688商品详情 公共参数 名称类型必须描述keyString是调用key&#xff08;必须以GET方式拼接在URL中&#xff09;注册Key和secret接入secretString是调用密钥api_nameString是API接口名称&#xff08;包括在请求地址中&#xff09;[item_…

Kafka request.log中RequestQueueTimeMs、LocalTimeMs、RemoteTimeMs、ThrottleTimeMs、含义

Kafka request.log中RequestQueueTimeMs、LocalTimeMs、RemoteTimeMs、ThrottleTimeMs、含义 要理解各个延时项的含义&#xff0c;必须从Kafka收到TCP请求、处理请求到返回TCP包整个流程开始梳理 RequestQueueTimeMs Processor 执行processNewResponses() 方法&#xff0c;不…

DPWWN1靶场详解

DPWWN1靶场详解 首先还是nmap -sP 192.168.102.0/24扫描到ip地址&#xff0c;然后对这个ip进行一个单独的扫描&#xff0c;发现这个靶场有一个mysql数据库&#xff0c;猜测可能会用到sql注入&#xff0c;但是没用到。 ip登陆到网页发现并没有什么可利用的 唯一的切入点也就数…

【Docker】Docker之镜像上传(阿里云镜像仓库)

注册阿里云镜像仓库 登录阿里云 登录成功后&#xff0c;搜索docker镜像 点击立即开通 创建个人实例 创建镜像仓库 点击下一步之后&#xff0c;可以选择代码源&#xff0c;本文选择的是本地仓库 镜像仓库创建成功&#xff0c;根据对应操作命令实现想要的功能&#xff0c;如上传镜…

Java 动态规划 剑指 Offer 47. 礼物的最大价值

代码展示&#xff1a; class Solution {public int maxValue(int[][] grid) {int mgrid.length;int ngrid[0].length;//创建dp数组int[][]dpnew int[m1][n1];//填充数组for(int i1;i<m;i){for(int j1;j<n;j){dp[i][j]Math.max(dp[i-1][j],dp[i][j-1])grid[i-1][j-1];}}r…

LLM模型微调方法总结

文章目录 Freeze方法P-tuning方法prefix-tuningPrompt TuningP-tuning v1P-tuning v2 Lora方法Qlora方法 在现在这大规模语言模型&#xff08;LLM&#xff09;盛行的时代&#xff0c;由于模型参数和显卡配置的因素&#xff0c;预训练基本是大公司或者高校可以完成的事情&#x…

SpringBoot+Prometheus+Grafana 监控面板(项目配置方式【入侵】)

SpringBootPrometheusGrafana 监控面板 提示&#xff1a;本文使用SpringBoot 简单样例&#xff0c;介绍基础配置和使用方法 包含内容&#xff1a;Docker、SpringBoot、Maven、 Prometheus、Grafana等 提示&#xff1a;本文包含官网内容介绍&#xff0c;具体更项目的学习&#x…

怎么学习Web框架和库相关知识?

学习Web框架和库相关知识可以帮助你构建高效、可扩展和安全的Web应用程序。以下是一些学习Web框架和库的方法和步骤&#xff1a; 确定学习目标&#xff1a; 明确你想学习的Web框架或库&#xff0c;例如常用的PHP框架&#xff08;如Laravel、Symfony&#xff09;或JavaScript库…

香橙派4和树莓派4B构建K8S集群实践之八: TiDB

目录 1. 说明 2. 准备工作 3. 安装 3.1 参考TiDB官方 v1.5安装说明 3.2 准备存储类 3.3 创建crd 3.4 执行operator 3.5 创建cluster/dashboard/monitor容器组 3.6 装好后的容器状况 3.7 设置访问入口(Ingress & Port) 4. 遇到的问题 5. 参考 1. 说明 建立TiDB…

Mongo可视化工具studio 3t无限试用

文章目录 前言一、下载二、使用步骤1.下载后,无脑下一步安装好2.开始无限试用 总结 前言 mongodb可以说是比较流行的nosql数据库了,它灵活多变的存储,为项目中后续可能的变更提供了极大的便利性,工欲善其事必先利其器,今天推荐一款mongo的可视化工具: studio 3t 一、下载 各版…

Linux驱动进阶(一)——设备驱动中的并发控制

文章目录 前言并发与竞争原子变量操作原子变量操作原子整型操作原子位操作 自旋锁自旋锁概述自旋锁的使用自旋锁的使用注意事项 信号量信号量概述信号量的实现信号量的使用自旋锁与信号量的对比 完成量完成量概述完成量的实现完成量的使用 小结 前言 现代操作系统有三大特征&a…

华为云流水线CodeArts Pipeline怎么样?能实现哪些功能?

华为云流水线服务CodeArts Pipeline&#xff0c;旨在提升编排体验&#xff0c;开放插件平台&#xff0c;并提供标准化的DevOps企业治理模型&#xff0c;将华为公司内的优秀研发实践赋能给伙伴和客户。 灵活编排、高效调度 开放流水线插件 内置企业DevOps研发治理模型 体验通…

Mysql常见的集群方案

一&#xff0c;MySQL Replication MySQL Replication 是官方提供的主从同步方案&#xff0c;用于将一个 MySQL 的实例同步到另一个实例中。Replication 为保证数据安全做了重要的保证&#xff0c;是目前运用最广的 MySQL 容灾方案。Replication 用两个或以上的实例搭建了 MySQ…

driftingblues3靶机详解

driftingblues3靶机复盘 打完这个靶机后发现自己最近一段时间进步了很多&#xff0c;并且有了一些自己的思想。 这里扫除来一个22和80端口&#xff0c;大概率是要用到ssh远程登陆的。 扫描ip的同时扫描了一下目录&#xff0c;发现扫描出来很多目录&#xff0c;这里我还很窃喜&…

linux中miniconda的重装问题

linux中miniconda的重装问题Linux安装condaconda使用yaml创建虚拟环境 注意问题&#xff1a; 安装minconda时&#xff1a; 安装好之后&#xff0c;把别人的环境直接复制到自己的‘miniconda3/envs’下&#xff0c;再修改该文件的拥有者和群组 source .bashrc 重新激活 问题…

虚幻引擎程序化资源生成框架PCG 之 UPCGBlueprintElement源码笔记(一)

UPCGBlueprintElement是PCGGraph中自定义节点的基类&#xff0c;但官方目前还没有给出详细的文档&#xff0c;所以从源代码里找点答案。 文章目录 可覆盖函数&#xff08;Override Functions&#xff09;Excute 和 Excute with ContextLoop Body函数和Loop函数Point Loop Body和…