ConnectedRouter + Redux "this.props.state" не определено - PullRequest
0 голосов
/ 09 апреля 2019

Я устанавливаю проект с использованием ConnectedRouter и Redux на ReactJS, но при попытке mapStateToProps состояние не определено.

Вот моя конфигурация - Магазин:

import { applyMiddleware, combineReducers, compose, createStore } from 'redux'
import reducers from './reducers'
import createSagaMiddleware from 'redux-saga'
import { createLogger } from 'redux-logger'
import { routerMiddleware, routerReducer } from 'react-router-redux'
import { composeWithDevTools } from 'redux-devtools-extension'
import { connectRouter } from 'connected-react-router'

import sagas from './sagas'
import ENV from '../../config/constants/env'
import createHistory from 'history/createBrowserHistory'

const { DEBUG } = ENV

export const history = createHistory()

function buildRootReducer(reducers) {
  return  Object.assign({}, reducers, { routing: routerReducer })
}

export const configureStore = (preloadState = {}) => {
  let composeEnhancers = compose

  // Middlewares
  const sagaMiddleware = createSagaMiddleware()
  const rMiddleware = routerMiddleware(history)
  let middlewares = [rMiddleware, sagaMiddleware]

  // reducers
  const allReducers = buildRootReducer(reducers)
  const combinedReducers = combineReducers({ router: connectRouter(history), allReducers })

  // Apply these middlewares only for dev mode
  if (DEBUG.ENABLED) {
    middlewares = [...middlewares, createLogger({ collapsed: true })]

    if (DEBUG.REDUX) {
      composeEnhancers = composeWithDevTools
    }
  }

  const store = createStore(
    combinedReducers,
    preloadState,
    composeEnhancers(applyMiddleware(...middlewares))
  )

  sagaMiddleware.run(sagas)

  return store
}
  • Маршрутизатор
const Routes = ({ history, context }) => {
  return (
    <ConnectedRouter history={history} context={context}>
      <Switch>
        {Object.keys(routeConfig)
          .filter(i => !routeConfig[i].hidden)
          .map(i => {
            const route = routeConfig[i]
            return (
              <Route
                path={route.path}
                render={() => route.render}
                exact={route.exact}
                key={route.path}
              />
            )
          })}
      </Switch>
    </ConnectedRouter>
  )
}
  • Использование в домашних условиях
const mapDispatchToProps = ({
  storageActionRequest: actionsCreator.storageActionRequest
})

const mapStateToProps = ({ storage }) => ({
  storageList: storage.list
})

export default connect(
  mapStateToProps,
  mapDispatchToProps
)(Home)

И тогда я получаю эту ошибку:

The above error occurred in the <StorageList> component:
    in StorageList (at Home.js:12)
    in div (at Home.js:11)
    in Home (created by Context.Consumer)
    in Connect(Home) (at routeConfig.js:13)
    in Route (at Routes.js:16)
    in Switch (at Routes.js:10)
    in Router (created by ConnectedRouter)
    in ConnectedRouter (created by Context.Consumer)
    in ConnectedRouterWithContext (created by Context.Consumer)
    in Connect(ConnectedRouterWithContext) (at Routes.js:9)
    in Routes (at App.js:15)
    in Provider (at App.js:14)
    in App (at src/index.js:5)
Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...