vue3+vite模块联邦 ----子应用中页面如何跳转传参

基座:

javascript 复制代码
// router/index.ts
const router = createRouter({
	history: xxx,
	routes: [{....}]
}


window._MAIN_ROUTER_ = router

export default router

子应用:

javascript 复制代码
// a.vue
 window._MAIN_ROUTER_.push({
  path: '/b',
  query: {
    id: xxx
  }
})

// b.vue中
const route = useRoute()
const id = route?.query?.id

问题:子应用中可以跳转,但是b.vue中id接收不到

原因:子应用中没有独立路由,也没有与基座应用共享 vue-router,导致 useRoute() 返回 undefined

解决方法:在模块联邦配置中共享 vue-router,让子应用能访问基座应用的路由实例

javascript 复制代码
// vite.config.ts 子应用和基座
export default defineConfig({
	plugins: [
			....,
			federation({
				...,
				shared: {
					...,
					'vue-router': {},
				}
			})
	]
})
相关推荐
IT_陈寒10 分钟前
Vite热更新失效?你可能漏了这个配置项
前端·人工智能·后端
FYKJ_201022 分钟前
django药饮个性化推荐系统54839-计算机课程设计、毕业设计
vue.js·spring boot·python·mysql·typescript·spark·django
10年前端老司机44 分钟前
Next.js+LangGraph.js+ 简历工具AI Agent完整落地
前端·langchain·agent
IT_陈寒6 小时前
Java中equals方法比了个寂寞?原来这才是正确的重写姿势
前端·人工智能·后端
默_笙6 小时前
🚓 分诊台与拆题术:让 RAG 学会判断和规划
前端·javascript
CopyCode6 小时前
用 AI 迁项目有多爽?我把 Webpack 迁 Vite 的全过程记下来了
前端·架构
去伪存真6 小时前
Electron 自动化发布指南:GitHub Actions 跨平台打包全纪录
前端·electron
计算机魔术师6 小时前
OpenAI智能体失控闯进美国政府网站,53张用户图片外泄背后
前端
颜进强6 小时前
14 · NestJS ExecutionContext 执行上下文:守卫、拦截器、过滤器拿到的"同一个 context",为什么能力不一样?
前端·后端·ai编程
程序员Flycan6 小时前
🚀 跨域终结者:前端代理服务器(Proxy)原理解析与配置总结
前端