[英]redux toolkit +connected-react-router
I'm trying to set up redux with connected-react-router, but I didn't really understand how to do that, I'm using the create-react-app --template redux, but if I try to do that I get the following error: Uncaught Error: Actions must be plain objects. Use custom middleware for async actions.
我正在尝试使用 connected-react-router 设置 redux,但我真的不明白该怎么做,我正在使用 create-react-app --template redux,但如果我尝试这样做,我得到以下错误:
Uncaught Error: Actions must be plain objects. Use custom middleware for async actions.
Uncaught Error: Actions must be plain objects. Use custom middleware for async actions.
import { configureStore, combineReducers } from "@reduxjs/toolkit";
import { connectRouter, routerMiddleware } from "connected-react-router";
import { createBrowserHistory } from "history";
import homePageSlice from "./reducers/homepage/homePageSlice";
export const history = createBrowserHistory();
export const store = configureStore({
reducer: {
router: connectRouter(history),
homepage: homePageSlice,
},
middleware: [routerMiddleware(history)],
});
setting middleware property will override the default middleware that configureStore injects.设置中间件属性将覆盖 configureStore 注入的默认中间件。
Use this:用这个:
middleware: [
actionToPlainObject,
routerMiddleware(history)
]
and create actionToPlainObject.ts并创建 actionToPlainObject.ts
import { Middleware } from '@reduxjs/toolkit';
import IStoreState from '../IStoreState';
export const actionToPlainObject: Middleware<IStoreState, any> = (store) => (
next
) => (action) => {
if (!action) {
return;
}
return next({ ...action });
};
If using class instances this allows to be passed to Redux.如果使用 class 实例,则允许将其传递给 Redux。
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.