无法使用 Redux applyMiddleware 函数应用多个中间件

Question

谁能帮助我正确的redux store 配置？

我正在尝试如下配置，

configureStore.js

import thunk from 'redux-thunk';
import logger from 'redux-logger';
import { createStore, applyMiddleware } from 'redux';
import rootReducer from '../reducers';

let middlewares = [thunk, logger]

const configureStore = () => {
  const store = createStore(
    rootReducer,
    applyMiddleware(...middlewares)  // I also tried with applyMiddleware(thunk, logger)
  );

  return store;
}

export default configureStore;

我导入这个模块主js文件并使用如下，

index.js

import configureStore from '../stores/configureStore';

const store = configureStore();

// And other DOM render code follows...

但似乎无法正常工作，并且 Web 控制台中显示以下错误，

错误：未捕获的类型错误：WEBPACK_IMPORTED_MODULE_0__compose.a.apply(...) 不是函数

错误所在的文件：

我正在关注redux、redux-thunk 和redux-logger 的官方文档，但无法使其正常工作。

另一个注意事项：当我从中间件列表中删除 thunk 和 logger 中的任何一个时，它工作正常。

更新：我得到了临时修复

将redux 从3.7.2 降级到3.5.2 可以正常工作。

我仍然想知道为什么这是最新版本的Redux 的问题。我尝试添加与该问题相关的更多信息，并为未来的升级寻找解决方案。

谢谢！

Answer 1

你只是犯了一个小错误。

来自官方docs，这里是createStore的签名：

createStore(reducer, [preloadedState], [enhancer])

您混淆了参数的顺序，将您的增强器函数 (applyMiddleware) 传递到该函数期望预加载状态的位置。您需要在 rootReducer 和 applyMiddleware 函数之间传入一个参数，以满足签名。

希望这有帮助！