如何使用redux状态与路由react-router?

时间:2017-11-16 11:00:27

标签: react-router react-redux

我创建了路线

<Provider store={store}>
    <Router history={browserHistory}>
        <Route path="/" component={App}>
        <Route path="/redux" component={redux} />
    </Router>
</Provider>

我的问题是当我从redux组件调度一个动作时,道具在/redux路线中发生变化,但/始终处于初始状态。请问谁可以帮助我?

1 个答案:

答案 0 :(得分:0)

尝试使用react-router-reduxhttps://github.com/reactjs/react-router-redux)将redux商店与react-router同步。

import { browserHistory } from 'react-router';
import { syncHistoryWithStore, routerReducer } from 'react-router-redux';
import { createStore, combineReducers } from 'redux';

// Add router reducer to your store on the `routing` key
const store = createStore(
  combineReducers({
    ...reducers,
    routing: routerReducer
  })
)
// Create enhanced history that syncs navigation events with the store
const history = syncHistoryWithStore(browserHistory, store);

...

<Provider store={store}>
    <Router history={history}>
        <Route path="/" component={App}>
        <Route path="/redux" component={redux} />
    </Router>
</Provider>