所以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上搜索过,无法找到与此错误相关的任何内容。
Uncaught Error: Actions must be plain objects. Use custom middleware for async actions.
但当我删除此部分window.__REDUX_DEVTOOLS_EXTENSION_COMPOSE__ && window.__REDUX_DEVTOOLS_EXTENSION_COMPOSE__()
时,我在控制台上看到test
表示操作成功(因为它现在的作用是什么)。但我需要这个部分用于开发目的,所以我该如何处理这个问题。我想我在这里做错了什么。
答案 0 :(得分:2)
您的商店增强器设置不正确。 applyMiddleware是商店增强器的一个示例。商店增强工具是向商店添加自定义功能的高级功能。
基本上所有商店增强器都应通过相同的参数通过函数组合传递。
如果要将多个商店增强程序传递到商店,则使用“撰写”。商店增强器是更高阶的功能,可为商店添加一些额外的功能。
为了简化操作,需要安装一个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 dev工具,可以使用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);