将单水疗容器应用程序与 Angular 子应用程序通信

Question

我需要帮助才能从我的容器单水疗中心与加载的 Angular 应用程序 (child) 进行通信。当用户单击父应用程序（ spa-container ）选项时，应与子应用程序通信以更改模式。

它不会经常发生。但无法找到从容器到加载的角度应用程序的通信方式。

spa本身给出了一个细节：spa-communication detail但不清楚，也没有详细的步骤。有人帮帮我吗？

Answer 1

我是 single-spa 的维护者之一。

我们倾向于在文档中对如何实现模块之间的通信持轻描淡写的看法，因为实现它的方法有很多，而且每种方法都各有利弊。在您描述的情况下，听起来您可能想从您发布的链接中探索选项 #3。

自定义浏览器事件

在父窗口中触发自定义事件。 API on MDN.

快速示例

//  in the parent (usually called the single-spa config or root-config in the documentation)
const event = new CustomEvent("myEvent", {favoriteMovie: 'StarWars'})
window.dispatchEvent(event)

// in the child (or registeredApplication)
window.addEventListener("myEvent", myEventHandlingFunction)

function myEventHandlingFunction(e) {...}

这至少应该让你开始，还有其他的沟通方式，而且这种特殊的方法并不是在所有情况下都是最好的解决方案。

另外值得注意的是，除非您包含 polyfill，否则 customEvents 在 IE11 中不起作用。