React Router + Redux？

Question

我在看this tutorial，我想知道你如何將它與redux一起使用？

我從教程

ReactDOM.render(
    <Router history={hashHistory}> 
    <Route path="/" component={Layout}> 
     <IndexRoute component={Featured}></IndexRoute> 
     <Route path="archives(/:article)" name="archives" component={Archives}></Route> 
     <Route path="settings" name="settings" component={Settings}></Route> 
    </Route> 
    </Router>, 
app); 

渲染現在

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

路由器呈現例如我不知道供應商如何融入進來。

Answer 1

所以Provider只是一個包裝應用程序其餘部分的包裝器組件，所以它應該包圍你的根組件，不管它是什麼。在上面描述的示例中，Router將被視爲應用程序中的根組件。即

ReactDom.render(
    <Provider store={store}> 
    <Router history={hashHistory}> 
     <Route path="/" component={Layout}> 
     <IndexRoute component={Featured}></IndexRoute> 
     <Route path="archives(/:article)" name="archives" component={Archives}></Route> 
     <Route path="settings" name="settings" component={Settings}></Route> 
     </Route> 
    </Router> 
    </Provider>, 
    document.getElementById('root') 
); 

雖然，大多數人會打破他們的路由到一個單獨的文件，所以它可能看起來更像這個..

routes.js

// imports 

export default (
    <Route path="/" component={Layout}> 
    <IndexRoute component={Featured} 
    <Route path="archives(/:article)" name="archives" component={Archives} /> 
    <Route path="settings" name="settings" component={Settings}></Route> 
    </Route> 
) 

index.js

// imports 
import routes from './routes'; 

ReactDOM.render(
    <Provider store={store}> 
    <Router history={hashHistory}>{routes}</Router> 
    </Provider>, 
    document.getElementById('root') 
); 

希望這有助於！

編輯：

進一步審查後，它看起來像你沒有在Router組件包routes，你可以簡單地做：<Router history={hashHistory} routes={routes} />只是認爲這是一個不錯的增強！