打字稿中的 Redux Toolkit 和 Next Redux Wrapper 类型错误？

Question

我正在尝试找到一种解决方案。我问了几个关于堆栈中相同问题的问题。但是没有人回答我的问题。如果有人回答这个问题，就会给出错误的信息。任何人都可以帮助我吗？我真的需要你的帮助。请抽出宝贵的时间。

我想用下一个 redux 包装器 (next-redux-wrapper) 配置 Redux 工具包 (@reduxjs/toolkit)。但是我遇到了一个问题。

错误是-

Type error: Type '(state: ReturnType<typeof combinedReducer>, action: AnyAction) => any' is not assignable to type 'Reducer<CombinedState<{ counter: { value: any; }; }>, AnyAction> | ReducersMapObject<CombinedState<{ counter: { value: any; }; }>, AnyAction>'.

Store.ts-

发生错误

import { Action, AnyAction, combineReducers, configureStore, ThunkAction } from '@reduxjs/toolkit';
import { createWrapper, HYDRATE } from 'next-redux-wrapper';
import { getMovies } from "./Reducer/movieReducer";

const combinedReducer = combineReducers({
    counter: getMovies
});

const reducer = (state: ReturnType<typeof combinedReducer>, action: AnyAction) => {
    if (action.type === HYDRATE) {
        const nextState = {
            ...state,
            ...action.payload,
        };
        return nextState;
    } else {
        return combinedReducer(state, action);
    }
};

export const makeStore = () => configureStore({ reducer }); //I am facing problem here in reducer

type Store = ReturnType<typeof makeStore>;

export type AppDispatch = Store['dispatch'];
export type RootState = ReturnType<Store['getState']>;
export type AppThunk<ReturnType = void> = ThunkAction<
    ReturnType,
    RootState,
    unknown,
    Action<string>
>;

export const wrapper = createWrapper(makeStore);

我发现这一行有错误-

export const makeStore = () => configureStore({ reducer });

您可以查看图片以更好地理解错误-

请抽出宝贵的时间。请帮我。我把它堆放了 1 个多月。我正在尝试但没有得到任何解决方案。请帮我。请帮助我。

Answer 1

应用程序中是否真的发生了错误？

对我来说，Typescript 似乎无法理解您的 reducer 实际上是类型 Reducer。

当我添加以下内容时，错误消失了：

Answer 2

每个减速器都必须能够用 undefined 调用。

要解决此问题，请执行

const reducer = (state: ReturnType<typeof combinedReducer>, action: AnyAction) => {

虽然我会

const reducer: typeof combinedReducer = (state, action) => {

相反。

打字稿中的 Redux Toolkit 和 Next Redux Wrapper 类型错误？

Type error with Redux Toolkit and Next Redux Wrapper in typescript?

typescript

redux

react-redux

next.js

redux-toolkit