Reactjs 全局共享Redux容器

摘要

我想要一个全局messenger，它引用了

存储

。让我们称它为

信使。我需要在不同的容器中使用它。它没有对应的React组件

我现在拥有的

class Messenger {
  constructor(store, webview) {
    if (!chrome.runtime.id) {
      return false;
    }

    this.webview = webview;
    this.store = store;

    if (chrome.runtime.id) {
      chrome.runtime.onMessage.addListener(this.messageHandler);
      chrome.commands.onCommand.addListener(this.commandHandler);
    }
  }

  sendMessage(msg) {
    if (this.webview.contentWindow) {
      this.webview.contentWindow.postMessage(msg, "*");  
    }
  }
}

Messenger应使用
存储
和
网络视图
对象初始化，如下所示：

$(function() {
  // exposing sandboxMessenger to a global namespace
  // so it can communicate with webview and sandbox
  window.app = {};
  app.sandboxMessenger = new SandboxMessenger(store, $('webview')[0]);

  ReactDOM.render(
    <Provider store={store}>
      <App />
    </Provider>,
    document.getElementById('app')
  );
});

<div id="app"></div> <!-- This part will be populated by React -->

<div id="webview-container">
  <!-- This part is isolated because I need to find it via $('#webview')[0];
  and pass it to Messenger -->
  <webview id="webview" src="sandbox/sandbox.html" partition="static"></webview>
</div>

我觉得理想的东西

我想将
webview容器
DOM包含到一个单独的
webview
React组件中。当它被装载时，我将初始化
Messenger
，因为我有一个
webview
对象

问题

如果我尝试遵循上述情况，我没有
存储
对象。如果我显式地传递了
store
，那么我必须手动订阅所有子容器中的store

问题

处理这种特定情况的最佳方法是什么？实现全局Redux容器的一般方法是什么？
与高阶组件类似？提供程序是一个全局Redux容器。为什么不让它处于最高级别并在其中工作？在什么情况下这样做是行不通的？@ZekeDroid从
Messenger
对象获取对全局redux容器的引用？除了将
store
对象暴露到
window.store=store
之外，我想不出任何其他方法。啊，好吧，但是为什么不把
信使
放在
提供者
中呢？