Question

我试图从组件中调用reducer并希望在组件中呈现它，但是当我尝试将reducer存储在redux的createStore（）方法中时，错误就会到来。我的代码是这样的： -

import { applyMiddleware, compose, createStore } from 'redux'
import thunk from 'redux-thunk'
import { browserHistory } from 'react-router'
import makeRootReducer from './reducers'
import { updateLocation } from './location'
import allReducers from './reducers';

export default (initialState = {}) => {
  // ======================================================
  // Middleware Configuration
  // ======================================================
  const middleware = [thunk]

  // ======================================================
  // Store Enhancers
  // ======================================================
  const enhancers = []

  let composeEnhancers = compose

  if (__DEV__) {
    const composeWithDevToolsExtension = window.__REDUX_DEVTOOLS_EXTENSION_COMPOSE__
    if (typeof composeWithDevToolsExtension === 'function') {
      composeEnhancers = composeWithDevToolsExtension
    }
  }

  // ======================================================
  // Store Instantiation and HMR Setup
  // ======================================================
  const store = createStore(
    allReducers,
    makeRootReducer(),
    initialState,

    composeEnhancers(
      applyMiddleware(...middleware),
      ...enhancers
    )
  )

我收到错误：未捕获错误：希望增强器成为功能

Answer 1

您将两个Reducer传递给createStore函数而不是一个。

由于createStore的第三个参数始终是增强函数，因此它认为＆＃39; initiaeState＆＃39;变量是一个增强函数，因为你将它作为createStore的thid参数传递给它。

createStore期望接收以下参数：

reducer（Function）：一个返回下一个状态的reduce函数   树，给定当前状态树和要处理的动作。


[preloadedState]（any）：初始状态。你可以选择   指定它以通用应用程序中的服务器水合状态，   或者恢复以前序列化的用户会话。如果你制作了   reducer with combineReducers，这必须是一个普通的对象   与传递给它的键相同的形状。否则，你可以自由通过   你的减速机可以理解的任何东西。



[enhancer]（功能）：商店增强器。你可以选择   指定它以增强具有第三方功能的商店   作为中间件，时间旅行，持久性等唯一的商店   随Redux一起提供的增强器是applyMiddleware（）。

请记住，应用中的根减速器应将所有减速器合并为一个减速器。

来自Redux docs

首先，了解您的全部内容非常重要应用程序实际上只有一个减速器功能

Answer 2

我遇到了类似的错误TypeError: enhancer(...) is not a function，因为我传递的是函数而不是普通对象作为初始状态。

即我的错误是由于我的初始状态生成器功能上缺少括号：

＆＃13;

const store = createStore(         
    reducer,                       
    testState,  // <<< missing brackets!! doh                 
    applyMiddleware(sagaMiddleware)
  )

＆＃13;

应该是：

＆＃13;

const store = createStore(         
    reducer,                       
    testState(),                   
    applyMiddleware(sagaMiddleware)
  )

＆＃13;

Answer 3

就我而言，这是错误的导入。

❌错误的导入：

import { applyMiddleware, createStore } from "redux";
import rootReducer from "../reducers/index";
import createSagaMiddleware from "redux-saga";
import rootSaga from "redux/sagas";
import { compose } from "@material-ui/system"; // <= ERROR: wrong compose

const sagaMiddleware = createSagaMiddleware();

const composeEnhancers = window.__REDUX_DEVTOOLS_EXTENSION_COMPOSE__ || compose;

const store = createStore(
  rootReducer,
  {},
  composeEnhancers(applyMiddleware(sagaMiddleware))
);

sagaMiddleware.run(rootSaga);

export default store;

✅正确导入：

import { applyMiddleware, compose, createStore } from "redux"; // <= Correct!
import createSagaMiddleware from "redux-saga";
import rootSaga from "redux/sagas";
import rootReducer from "../reducers/index";

const sagaMiddleware = createSagaMiddleware();

const composeEnhancers = window.__REDUX_DEVTOOLS_EXTENSION_COMPOSE__ || compose;

const store = createStore(
  rootReducer,
  {},
  composeEnhancers(applyMiddleware(sagaMiddleware))
);

sagaMiddleware.run(rootSaga);

export default store;

未捕获错误：期望增强器成为一个函数

3 个答案: