Redux:减速器收到的先前状态有意外类型的"功能"

Nem*_* Ga 23 reactjs redux react-redux

当我为chrome扩展添加中间件时,reducers在站点上停止正常工作(但chrome/redux调试工具正常工作)+我在控制台中出现以下错误:

减速器接收的先前状态具有意外类型的"功能".预期参数为具有以下键的对象:"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;
Run Code Online (Sandbox Code Playgroud)

如果我删除铬部分:

,window.devToolsExtension ? window.devToolsExtension() : f => f
Run Code Online (Sandbox Code Playgroud)

如果再次正常工作.

Her*_*rku 51

createStore最多需要3个参数.如果第二个参数是函数,则假定您的第二个参数是存储增强器.如果它是一个对象或存在3个参数,则假定该参数是您的初始状态.看到这里.

您的中间件变量是商店增强器,chrome扩展也是增强器:

window.devToolsExtension ? window.devToolsExtension() : f => f
Run Code Online (Sandbox Code Playgroud)

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

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;
Run Code Online (Sandbox Code Playgroud)

有关此文档可在此处找到.


Grg*_*gur 16

createStore 接受以下参数:

  • 减速器
  • 预加载状态
  • 增强

如果只提供了两个参数而第二个参数是一个函数,那么它被认为是一个增强器.在源代码中查看更多内容.

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

    import { applyMiddleware, createStore, compose } from 'redux';

    const store = createStore(
      reducer,
      compose(
        middleware,
        window.devToolsExtension ? window.devToolsExtension() : f => f
      )
    )
Run Code Online (Sandbox Code Playgroud)

希望有所帮助.Pozdrav