Javascript 如何在不同的子树中保存来自提供者的上下文？

所以门户解决的一个有趣而令人惊奇的特性是，即使您的组件需要在其他地方呈现，也要保留提供者提供的上下文。如果使用ContextProvider包装组件子树，则在该子树中呈现的任何组件都可以访问上下文值

反过来，如果您在子树之外呈现某些内容，它将无法访问该上下文。React门户解决了这个问题，因此如果您想在子树之外渲染某些内容，可以在同一子树内进行渲染。我认为：

无论子级是否为门户，上下文等功能的工作方式都完全相同，因为门户仍然存在于React树中，而不管它在DOM树中的位置如何

我想我并没有概念化这是如何实际运作的。React门户如何能够访问上下文而不需要在同一子树中呈现？听起来像是在幕后，门户是“反应树”的一部分？所以一定有一些花哨的“传递信息，然后呈现门户逻辑”？为了澄清我的问题

---

门户在保留对上下文值的访问方面究竟是如何工作的

我已经有很长一段时间没有收到答案了——我希望深入研究React的代码，但没有机会（希望有一天更新我的答案），但简而言之，这是如何在幕后工作的，React正在维护自己的组件树（你可能听说过这被称为虚拟DOM），并且在其中，创建的组件仍将位于虚拟DOM中的提供程序子树中

这里谈一点

我们没有对ReactDOM.render（）进行两次调用，而是创建两个门户，并在顶级提供程序下呈现这两个门户。ComponentA和ComponentB将在DOM中的两个不同点上呈现，但由于门户，它们共享同一个React树