为什么 Redux 不调用 reducer？答案

【问题标题】：Why reducer not get called for Redux?为什么 Redux 不调用 reducer？
【发布时间】：2022-01-21 03:34:18
【问题描述】：

这是我的减速器：

// slices/User.ts

import { Action, createSlice, PayloadAction } from "@reduxjs/toolkit";
import { GetUserOut } from "../tikexModule/Types";

const initialState = {
  value: null,
};

const userSlice = createSlice({
  name: "user",
  initialState,
  reducers: {
    setUser(state, action: PayloadAction<GetUserOut | null>) {
      state.value = action.payload;
    },
  },
});

export const { setUser } = userSlice.actions;
export default userSlice.reducer;

这就是我所说的：

dispatch(setUser(getUserOut));

参数为：

使用的类型：

export type GetUserOut = {
  data?: GetUserOutData;
  error?: string;
};

export type GetUserOutData = {
  isTiketAdmin?: boolean;
  showOrganizationList?: boolean;
  isMarketingPartner?: boolean;
  barionId?: string;
  partnerData?: NameAndAddress;
  deliveryData?: NameAndAddress;
  name?: string;
  email?: string;
  jwt?: string;
};

还有 storage.ts，我也在 localhost 中做永久存储：

import {
  Action,
  combineReducers,
  configureStore,
  ThunkAction,
} from "@reduxjs/toolkit";
import { createWrapper } from "next-redux-wrapper";
import { setUser } from "./slices/User";

const combinedReducer = combineReducers({
  user: setUser,
});

const makeStore = () => {
  const isServer = typeof window === "undefined";

  if (isServer) {
    return configureStore({
      reducer: combinedReducer,
    });
  } else {
    const { persistStore, persistReducer } = require("redux-persist");
    const storage = require("redux-persist/lib/storage").default;

    const persistConfig = {
      key: "nextjs",
      whitelist: ["user"],
      storage,
    };

    const persistedReducer = persistReducer(persistConfig, combinedReducer);

    const store: any = configureStore({
      reducer: persistedReducer,
      devTools: true,
    });

    store.__persistor = persistStore(store);

    return store;
  }
};

export type AppStore = ReturnType<typeof makeStore>;
export type RootState = ReturnType<AppStore["getState"]>;
export type AppDispatch = ReturnType<AppStore["dispatch"]>;
export type AppThunk<ReturnType = void> = ThunkAction<
  ReturnType,
  RootState,
  unknown,
  Action
>;

export const wrapper = createWrapper<AppStore>(makeStore, { debug: true });

【问题讨论】：

标签： redux next.js redux-toolkit

【解决方案1】：

您是从切片文件中导入动作创建者，而不是归约器。


import userReducer from "./slices/User";

const combinedReducer = combineReducers({
  user: userReducer,
});

【讨论】：