Redux：化简器之前收到的状态具有意外类型的"Function"

Question

当我为chrome扩展添加中间件时，reducer在现场停止正常工作(但chrome/redux调试工具有效)+我在控制台上得到以下错误:

减速机接收到的前一个状态的异常类型为"Function"。期望参数是一个具有以下键的对象:"auth"， "common"， "home"

代码如下:

import { applyMiddleware, createStore } from 'redux';
import { promiseMiddleware, localStorageMiddleware } from './middleware';
import reducer from './reducer';
const middleware = applyMiddleware(promiseMiddleware, localStorageMiddleware);
const store = createStore(reducer, middleware,
      window.devToolsExtension ? window.devToolsExtension() : f => f);
export default store;

如果我删除铬部分:

,window.devToolsExtension ? window.devToolsExtension() : f => f

Answer 1

createStore最多接受3个参数。如果第二个参数是一个函数，则假定第二个参数是存储增强器。如果它是一个对象或存在3个参数它假设参数是您的初始状态。看到这里。

你的中间件变量是一个存储增强器，chrome扩展也是一个增强器:

window.devToolsExtension ? window.devToolsExtension() : f => f

你必须将两者组合在一个函数中:

import { applyMiddleware, createStore, compose } from 'redux';
import { promiseMiddleware, localStorageMiddleware } from './middleware';
import reducer from './reducer';
const middleware = applyMiddleware(promiseMiddleware, localStorageMiddleware);
const store = createStore(
  reducer,
  compose(middleware, window.devToolsExtension ? window.devToolsExtension() : f => f)
);
export default store;

相关文档可以在这里找到

Answer 2

createStore接受以下参数:

• 减速器
<
• 预紧状态/gh>
• 增强剂

如果只提供了两个实参，并且第二个实参是一个函数，则认为它是一个增强器。在源代码中查看更多信息。

如果你想使用Redux devtools，那么你应该compose它作为一个额外的增强器。

    import { applyMiddleware, createStore, compose } from 'redux';
    const store = createStore(
      reducer,
      compose(
        middleware,
        window.devToolsExtension ? window.devToolsExtension() : f => f
      )
    )

希望有帮助。Pozdrav😉