React-маршрутизатор-перевождите ошибку при создании магазина с промежуточным

Question

Я новичок реагировать-Redux и пытаемся следовать учебнику, который немного старый, поэтому, когда я попробуйте запустить этот код я получаю ошибка:

Uncaught Ошибка: ожидалось, что состояние маршрутизации будет доступно либо как state.routing, либо как пользовательское выражение, которое вы можете указать как selectLocationState в параметрах syncHistoryWithStore(). Убедитесь, что вы добавили routerReducer к редукторам вашего магазина через combineReducers или любым другим способом, который вы используете для изоляции ваших редукторов.

Любые советы? :)

index.js

import React from 'react' 
import ReactDOM from "react-dom" 
import { createStore, applyMiddleware } from 'redux' 
import { Provider } from 'react-redux' 
import { Router, Route, browserHistory } from 'react-router' 
import { syncHistoryWithStore, routerReducer } from 'react-router-redux' 
import App from './containers/App' 
import rootReducer from './reducers/reducers' 
import thunkMiddleware from 'redux-thunk' 
import api from './middleware/api' 

let createStoreWithMiddleware = applyMiddleware(thunkMiddleware, api)(createStore) 

let store = createStoreWithMiddleware(rootReducer) 

let history = syncHistoryWithStore(browserHistory, store) 

let rootElement = document.getElementById('root') 

ReactDOM.render(
    <Provider store={store}> 
    <Router history={history}> 
     <Route path='/' component={App} /> 
    </Router> 
    </Provider>, 
    rootElement 
) 

моего reducers.js выглядит следующим образом:

import { combineReducers } from 'redux' 

import Auth from './auth' 
import Quotes from './quotes' 

const rootReducer = combineReducers({ 
    auth: Auth, 
    quotes: Quotes 
}) 

export default rootReducer 

Answer 1

Вы должны добавить routerReducer() для синхронизации работы в реакции маршрутизаторов-Redux.

Эта функция редуктора хранит обновления местоположения из истории. Если вы используете , используйте combReducers, он должен быть вложен под ключ маршрутизации.

Включите в свои комбинированные редукторы следующее.

import { routerReducer } from 'react-router-redux'; 

export const reducers = combineReducers({ 
    ... // other reducers 
    routing: routerReducer 
}); 

Так что ваш файл редукторов выглядит следующим образом:

import { routerReducer } from 'react-router-redux'; 
import { combineReducers } from 'redux' 

import Auth from './auth' 
import Quotes from './quotes' 

const rootReducer = combineReducers({ 
    auth: Auth, 
    quotes: Quotes, 
    routing: routerReducer 
}) 

export default rootReducer