JeecgBoot icon indicating copy to clipboard operation
JeecgBoot copied to clipboard

jeecgboot2.x vue2 微前端qiankun集成

Open Lemnaminor opened this issue 2 years ago • 0 comments

版本号:2.4.6
前端版本:vue2
问题描述:

项目背景: 有几个项目都是用jeecgboot2.x版本开发,因后端整合成一套代码,共用了sys系统模块,前端之前都是单个项目独立开发,导致前端每个项目共用了一个导航菜单数据。

项目需求: 因共用一个菜单导致A项目看到了B项目的菜单 无法点击。故考虑集成qiankun微前端模式使A项目可以点击B项目菜单实现不同项目之前跳转。

问题解决: 自己根据贵方官方文档 http://doc.jeecg.com/2554339 微前端高级改造 修改项目。把id="content" class="app-view-box" div 容器盒子挂载到/components/layouts/TabLayout.vue下并未成功显示子应用。 故挂载到App.vue 根节点 可以访问。但是不同应用跳转的时候,逻辑会先走utils.js generateChildRouters()方法下的componentPath = resolve => require(['@/' + component + '.vue'], resolve) 报错:Cannot find module './views/crm/company/qyIntention/QyIntentionList.vue' 截图在下,因A项目本来没有B项目的组件模块导致报错,无法跳转。 因曲线救国在跳转前permission.js router.beforeEach前判断手动改变添加子应用url路径实现 加载不用子应用模块。但是这样跳转不用子应用的时候会刷新下页面。 请问怎么可以做到无刷加载不用子应用呢。有具体的代码供参考一下吗。qiankun了解不深,望大佬解惑。

截图&代码:

image image

Lemnaminor avatar Nov 02 '22 09:11 Lemnaminor