首页
学习
活动
专区
工具
TVP
发布
精选内容/技术社群/优惠产品,尽在小程序
立即前往
  • 您找到你想要的搜索结果了吗?
    是的
    没有找到

    后台tab接入微应用的问题

    记录在旧后台系统中嵌入微应用时,遇到的关于 tab 标签及组件缓存的问题 页面结构 ? ? 这里主要功能都将通过 main.vue 组件渲染到右侧容器中, 左侧为主菜单。...每一子被激活后,将新增tab标签。tab 标签之间切换将不更新组件内容。 原来组件渲染结构 ? 这里iframe未被使用,所以关注点在两个路由的渲染入口, 1. tab内容入口 2....其他子内容入口. 多 keep-alive 与 router-view 我们知道 keep-alive 用于维持组件状态,router-view 将作为路由匹配后的组件渲染出口....实际测试会发现,单一出口时,路由切换, tab标签关闭后新增,都将维持组件的状态。 这就和我们的预期有出入了, 我们期望关闭tab标签关闭后,组件状态也被重置。...这里子应用作为微应用时将设置统一的路由前缀,类似主应用的嵌套路由组件 总结 对于这类tab标签引入微应用的情况, 主要的问题是: 主次应用路由嵌套关系 子应用指定渲染容器 子应用的生命周期控制

    1.1K41

    跨浏览器tab的通信解决方案尝试

    目标 当前页面需要与当前浏览器已打开的的某个tab通信,完成某些交互。其中,与当前页面待通信的tab可以是与当前页面同域(相同的协议、域名和端口),也可以是跨域的。...通信,兼容性 通过caniuse网站查询storage事件发现,IE的浏览器支持非常的不友好,caniuse使用了“completely wrong”的形容词来表述这一程度。...这种情况才是最急需解决的问题,如何实现两个没有任何关系的tab页面通信,这需要一些技巧,而且需要有同时修改这两个tab页面的权限,否则根本不可能实现这两个tab的能力。...为此,我想到了iframe,通过在这两个tab嵌入同一个iframe实现“桥接”,最终完成通信: tab A -----> iframe A[bridge.html]...A和tab B中引入“桥接”功能的iframe[bridge.html]页面,实现了两个无关tab的双向通信,这种实现的技巧性较强。

    2.2K40
    领券