如何在路由反应路由器中使用 redux 状态?
问题描述:
我创建了我的路线
<Provider store={store}>
<Router history={browserHistory}>
<Route path="/" component={App}>
<Route path="/redux" component={redux} />
</Router>
</Provider>
我的问题是当我从 redux 组件分派一个动作时,道具在 /redux
路线中改变了,但在 /
中总是初始状态.请问谁能帮帮我?
My problem is when I dispatch an action from redux component , the props changed in the /redux
route but in the /
always the initial state. Please who can help me ?
答
尝试使用 react-router-redux
(https://github.com/reactjs/react-router-redux) 将 redux
存储与 react-router.
Try to use react-router-redux
(https://github.com/reactjs/react-router-redux) to synchronise redux
store with 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>