前端qiankun如何实现微应用路由跳转

appContext:qiankun 沙箱的上下文对象,包含了子应用的信息和一些常用的方法和属性
config:子应用的配置对象
globalProperties:子应用的全局属性对象,它可以被子应用中的所有组件和模块访问
$mainRouter:这是父应用的路由实例,它可以通过 globalProperties 访问
push:'/tms-order/complaint/complaintList':使用父应用的路由实例跳转到子应用中的 /tms-order/complaint/complaintList 路径
query:{data}:父应用通过路由跳转传递data参数给子应用

1、传参跳转页面

<script lang="ts" setup>
import { getCurrentInstance,ComponentInternalInstance  } from 'vue';
const { appContext } = getCurrentInstance() as ComponentInternalInstance;
function toOrder(){const data = JSON.stringify({name:'JohnDoe',age:30})appContext.config.globalProperties.$mainRouter.push({path:'/tms-order/complaint/complaintList',query:{data}})
}
</script>
<template><el-button @click="toOrder">跳转至order模块</el-button>
</template>

2、跳转的页面

<script lang="ts" setup>
import { useRoute } from 'vue-router';
const route = useRoute();
onMounted(()=>{const dataString:any = route.query.dataconst data = JSON.parse(dataString);console.log('datadatadata',data);
})
</script>

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

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

相关文章

[C语言]——动态内存管理

目录 一.为什么要有动态内存分配 二.malloc和free 1.malloc 2.free 三.calloc和realloc 1.calloc 2.realloc 3.空间的释放​编辑 四.常见的动态内存的错误 1.对NULL指针的解引用操作 2.对动态开辟空间的越界访问 3.对非动态开辟内存使用free释放 4.使用free释放⼀块…

外汇110:谷歌起诉应用程序开发商伪造加密投资APP诈骗!

谷歌&#xff08;Google&#xff09;已对两家应用程序开发商提起诉讼&#xff0c;指控其参与“国际在线消费者投资欺诈计划”。该计划欺骗用户从 Google Play 商店和其他渠道下载虚假的安卓&#xff08;Android&#xff09;应用程序&#xff0c;并以承诺更高回报为幌子窃取他们…

SinoDB用户权限

SinoDB用户权限是由数据库对象和操作类型两个要素组成的&#xff0c;定义一个用户的权限就是定义这个用户可以对哪些数据对象进行哪些类型的操作。 SinoDB使用了三级权限来保证数据的安全性&#xff0c;它们分别是数据库级权限&#xff0c;表级权限和字段级权限。 1. 数据库级…

备考ICA----Istio实验17---TCP流量授权

备考ICA----Istio实验17—TCP流量授权 1. 环境准备 1.1 环境部署 kubectl apply -f <(istioctl kube-inject -f istio/samples/tcp-echo/tcp-echo.yaml) -n kim kubectl apply -f <(istioctl kube-inject -f istio/samples/sleep/sleep.yaml) -n kim1.2 测试环境 检测…

2024.3.11力扣每日一题——将标题首字母大写

2024.3.11 题目来源我的题解方法一 模拟方法二 官方优化版本 题目来源 力扣每日一题&#xff1b;题序&#xff1a;2129 我的题解 方法一 模拟 直接模拟变化就可以了 时间复杂度&#xff1a;O(n)。n表示字符的数量 空间复杂度&#xff1a;O(m)。m表示单词的数量 public Strin…

LangChain-14 Moderation OpenAI提供的功能:检测内容中是否有违反条例的内容

背景描述 我们在调用OpenAI的接口时&#xff0c;有些内容可能是违反条例的&#xff0c;所以官方提供了一个工具来检测。 安装依赖 pip install --upgrade --quiet langchain-core langchain langchain-openai编写代码 下文中我们使用了: OpenAIModerationChain 这个工具来…

PHP运算符与流程控制

华子目录 运算符赋值运算符算术运算符比较运算符逻辑运算符连接运算符错误抑制符三目运算符自操作运算符 计算机码位运算符 运算符优先级流程控制控制分类顺序结构分支结构if分支switch分支 循环结构for循环while循环continuebreak 运算符 运算符&#xff1a;operator&#xf…

电商数据分析26——电商平台流量来源分析与优化策略

目录 写在开头1. 电商平台流量概览1.1 流量来源的分类1.2 各流量来源的特性与价值 2. 流量来源的数据分析方法2.1 流量数据收集与整理2.2 流量质量评估指标2.3 流量转化路径分析 3. 流量来源优化策略3.1 提升自然搜索流量的SEO策略关键词优化内容优化技术优化示例&#xff1a;在…

JNA、JNI、原生C++函数调用效率及测试过程

结论 如果JAVA要高效调用C函数&#xff0c;则需要通过JNI封装C函数后进行native方法调用&#xff0c;JNI的执行效率比JNA高600倍左右。从开发效率上来说&#xff0c;JNA开发速度比JNI快许多&#xff0c;因为不需要做二次封装 测试对比 纯C调用&#xff1a; Function call to…

深入了解iOS内存(WWDC 2018)笔记-内存诊断

主要记录下用于分析iOS/macOS 内存问题的笔记。 主要分析命令&#xff1a; vmmap, leaks, malloc_history 一&#xff1a;前言 有 3 种思考方式 你想看到对象的创建吗&#xff1f;你想要查看内存中引用对象或地址的内容吗&#xff1f;或者你只是想看看 一个实例有多大&#…

【强化学习】Actor-Critic

Actor-Critic算法 欢迎访问Blog全部目录&#xff01; 文章目录 Actor-Critic算法1.Actor-Critic原理1.1.简述1.1.优劣势1.3.策略网络和价值网络1.3.1.策略网络&#xff08;Actor)1.3.2.价值网络&#xff08;Critic) 1.4.程序框图和伪代码 2.算法案例&#xff1a;Pendulum-v12…

T-Mamba:用于牙齿 3D CBCT 分割的频率增强门控长程依赖性

T-Mamba&#xff1a;用于牙齿 3D CBCT 分割的频率增强门控长程依赖性 摘要Introduction方法T-Mamba architectureTim block T-Mamba: Frequency-Enhanced Gated Long-Range Dependendcy for Tooth 3D CBCT Segmentation 摘要 三维成像中的高效牙齿分割对于正畸诊断至关重要&am…

linux下的用户与用户组

linux下的用户与用户组 一、Linux用户 Linux是一个多用户操作系统&#xff0c;不同的用户拥有不同的权限。可以查看和操作不同的文件。 Ubuntu有三种用户&#xff1a; 1、初次创建的用户。 2、root用户 3、普通用户。 初次创建的用户权限比普通用户多&#xff0c;但是没有ro…

JavaScript - 你知道DOM和BOM的区别吗

这两个都是JavaScript里的知识点,在开发中,经常会有一些单词,通过他们的首字母形成一个新的看似单词其实又不是单词的玩意。他们都是用来描述浏览器的特定的对象模型的。 1 是否要记住单词拆分? 如果你的英文比较好,就可以优先回答他们对应的英文全称,如DOM是Document O…

Windows系统读取XDMA实际运行链路速度和PCIE带宽

在我们平常设计XDMA的时候&#xff0c;经常会遇到一个问题&#xff1a; 在Vivado中设计的XDMA IP中选择的PCIE带宽和链路速度是理想的&#xff0c;但是下到板卡运行的时候&#xff0c;测量速度却发现读写速度根本不是理想中的速度&#xff0c;找不到问题&#xff0c;无法证明我…

General error during semantic analysis: Unsupported class file major version 61

新买的信创笔记本,Linux系统,安装完Java和Android Studio之后,运行报如下错误。根本原因是打开旧项目时,Android Studio 的gradle的JDK 版本过高导致。 FAILURE: Build failed with an exception.* Where: Initialization script /tmp/ijMapper1.gradle* What went wrong:…

Octopus:2B 参数语言模型即可媲美 GPT-4 的函数调用性能

近年来&#xff0c;大语言模型在 PC、智能手机和可穿戴设备的操作系统中应用逐渐成为趋势。 例如&#xff0c;MultiOn (Garg, 2024) 和 Adept AI (Luan, 2024) 等 AI 助理工具&#xff0c;以及 Rabbit R1 (Lyu, 2024) 和 Humane AI Pin (Chaudhri, 2024) 等 AI 消费产品在消费者…

蓝桥杯 交通信号 2022研究生组

问题&#xff1a; Dijstra算法变形题&#xff0c;有向边分正行和逆行方向&#xff0c;注意逆行的绿灯时间是正行的红灯时间。 这题的关键是理清从当前节点出发&#xff0c;到下一个节点是哪一时刻&#xff0c;理清这一点后&#xff0c;再跑Dijstra算法求最短路。 假设curr_t时…

JavaScript(三)-Web APIS

文章目录 DOM事件进阶事件流事件流与两个阶段说明事件捕获事件冒泡阻止冒泡解绑事件 事件委托其他事件页面加载事件元素滚动事件页面尺寸事件 元素尺寸与位置 DOM事件进阶 事件流 什么是事件流 事件流指的是事件完整执行过程中的流动路径 事件流与两个阶段说明 捕获与冒泡 …

从零开始精通RTSP之初识实时流协议

概述 在数字化浪潮席卷全球的今天&#xff0c;实时音视频通信已经成为人们日常生活、工作以及娱乐中不可或缺的一部分。无论是直播平台、在线会议、远程教育&#xff0c;还是安防监控系统&#xff0c;都离不开高效可靠的实时流传输技术。其中&#xff0c;RTSP作为一种广泛应用的…