在不同的 React 應用程序之間共享路由

Question

我有一個類似於以下內容的 react-redux proto

    html
   <body>
      <div id="app1"></div>
      <div id="app2"></div>
    </body>

有 2 個活躍的應用程序共享同一個商店，但在不同的 div 中呈現。 React 代碼做這樣的事情

    Js
        ReactDOM.render(
        <Provider store={ store }>
          <Component1 />
        </Provider>,
          document.getElementById('app1')
        );

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

如果我需要實現一個共享的反應路由系統，當 app1 發生變化並修改 URL 時，它會被傳遞給 app2 並相應地更新它......像這樣的事情

Js
        ReactDOM.render(
        <Provider store={ store }>
           <Router history={ browserHistory }>
            <Route path="/(:param)" component={ Component1 } />
           </Router>
        </Provider>,
          document.getElementById('app1')
        );

        ReactDOM.render(
        <Provider store={ store }>
          <Route path="/" component={ App2 }>
           <Route path="/otherRoute(/:otherParam)" component={ Component2 } />
          </Route>          
        </Provider>,
          document.getElementById('app2')
        );

因此 Component1 中的 action 將調用 Route /otherRoute(/:otherParam) 對 component2 有效並觸發 Component2 中的渲染

React / Redux 甚至有可能做一些可行的事情嗎？

Answer 1

看起來解決這個不尋常問題的最佳方法是不使用 react-router 並使用庫歷史記錄（react-router 所基於的）直接實現自定義路由器。 更多資源

使用 Redux 和 React 進行簡單路由

你可能不需要 React Router

在不同的 React 應用程序之間共享路由

問題描述

1 個解決方案

解決方案1
1 2017-02-09 16:56:51

在不同的 React 應用程序之間共享路由

問題描述

1 個解決方案

解決方案1 1 2017-02-09 16:56:51

解決方案1
1 2017-02-09 16:56:51