Redux存储在不同的Reducer中两次显示相同的状态

cnwbcb6i  于 2023-02-19  发布在  其他
关注(0)|答案(1)|浏览(116)

Redux DevTools显示两个不同减压器的相同状态
我尝试在我的React项目中使用Redux添加第二个Reducer,以便对我的状态进行一些概述。每当我在Redux DevTools中查看状态时,我会看到相同的状态,但使用不同的Reducer。
DevTools插件在generalSlice和plannerSlice中显示plannerSlice.js的内容(createDialogOpen和editDialogOpen)。
如何在devTools中的generalSlice下获取darkTheme
Store.js

import { configureStore } from "@reduxjs/toolkit";
import generalSlice from "./slicers/plannerSlice";
import plannerSlice from "./slicers/plannerSlice";

export default configureStore({
  reducer: {
    general: generalSlice,
    planner: plannerSlice,
  },
});

generalSlice.js

import { createSlice } from "@reduxjs/toolkit";

export const generalSlice = createSlice({
  name: "general",
  initialState: {
    appTheme: "dark",
  },
  reducers: {
    appTheme: (state) => {
      if (state.appTheme === "dark") {
        state.appTheme = "light";
      } else {
      state.appTheme = "light";
      }
    },
  },
});

// Action creators are generated for each case reducer function
export const { appTheme } = generalSlice.actions;

export default generalSlice.reducer;

plannerSlice.js

import { createSlice } from "@reduxjs/toolkit";

export const plannerSlice = createSlice({
  name: "planner",
  initialState: {
    createDialogOpen: false,
    editDialogOpen: false,
  },
  reducers: {
    createDialogOpen: (state, action) => {
      state.createDialogOpen = action.payload;
    },
    editDialogOpen: (state, action) => {
      state.editDialogOpen = action.payload;
    },
  },
});

// Action creators are generated for each case reducer function
export const { createDialogOpen, editDialogOpen } = plannerSlice.actions;

export default plannerSlice.reducer;
ztmd8pv5

ztmd8pv51#

当我再次阅读我的问题时,我注意到我导入了两次相同的切片...只是用了不同的名称。
Store.js

import generalSlice from "./slicers/plannerSlice";
import plannerSlice from "./slicers/plannerSlice";

相关问题