reducer 接收到的先前状态具有意外的类型 "Function"。预期参数是具有以下键的对象："register"

Question

所以 redux thunk 给我这个错误（或者可能不是 redux-thunk，而是扩展名）

The previous state received by the reducer has unexpected type of "Function".
Expected argument to be an object with the following keys: "register"

商店

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

const store = createStore(
    reducers,
    applyMiddleware(thunk),
    window.__REDUX_DEVTOOLS_EXTENSION_COMPOSE__ && window.__REDUX_DEVTOOLS_EXTENSION_COMPOSE__()
);

export default store;

减速器

import { combineReducers } from 'redux';

import register from './register';

const reducers = combineReducers({
    register
});

export default reducers;

行动

import axios from 'axios';

export function changeDOB(payload) {
    return dispatch => {
        console.log('test');
    }
}

但出于某种原因，当我删除 window.__REDUX_DEVTOOLS_EXTENSION_COMPOSE__ && window.__REDUX_DEVTOOLS_EXTENSION_COMPOSE__() 时错误消失了，我不知道为什么扩展会给我这个错误，但看起来我是唯一遇到它的人。我在 google 上进行了搜索，但找不到与此错误相关的任何内容。

顺便说一句，还有一个错误，所以 onload 弹出那个错误，当我尝试测试这个动作时，它产生了以下错误：

Uncaught Error: Actions must be plain objects. Use custom middleware for async actions.

但是当我删除这部分时 window.__REDUX_DEVTOOLS_EXTENSION_COMPOSE__ && window.__REDUX_DEVTOOLS_EXTENSION_COMPOSE__() 我在我的控制台上看到 test 这意味着操作成功（因为这是它现在所做的）。但是我需要那部分用于开发目的，所以我该如何处理。我想我在这里做错了什么。

Answer 1

您的店铺增强器设置不正确。 applyMiddleware 是商店增强器的示例。商店增强器是高阶函数，可以为商店添加自定义功能。

基本上，您所有的商店增强器都应该通过相同参数通过函数组合传入。

当您想将多个商店增强器传递给商店时，可以使用 Compose。商店增强器是为商店添加一些额外功能的高阶函数。

为了让事情更简单，可以安装一个 npm 包：

npm install --save redux-devtools-extension

并像这样使用：

import { createStore, applyMiddleware } from 'redux';
import { composeWithDevTools } from 'redux-devtools-extension';

const store = createStore(reducer, composeWithDevTools(
  applyMiddleware(...middleware),
  // other store enhancers if any
));

这是 redux 文档中的替代设置，如果您不想在生产中使用 redux 开发工具，可以使用它

import { createStore, combineReducers, applyMiddleware, compose } from 'redux';
import thunk from 'redux-thunk';
import * as reducers from '../reducers/index';

let reducer = combineReducers(reducers);
let middleware = [thunk];

let finalCreateStore;

// In production, we want to use just the middleware.
// In development, we want to use some store enhancers from redux-devtools.
if (process.env.NODE_ENV === 'production') {
  finalCreateStore = applyMiddleware(...middleware)(createStore);
} else {
  finalCreateStore = compose(
    applyMiddleware(...middleware),
    require('redux-devtools').devTools()
  )(createStore);
}

let store = finalCreateStore(reducer);

reducer 接收到的先前状态具有意外的类型 "Function"。预期参数是具有以下键的对象："register"

The previous state received by the reducer has unexpected type of "Function". Expected argument to be an object with the following keys: "register"

asynchronous

redux

redux-thunk