如何为同一数据类型的多个实例重用 Redux reducer 逻辑？答案

【问题标题】：How to reuse Redux reducer logic for multiple instances of the same data type?如何为同一数据类型的多个实例重用 Redux reducer 逻辑？
【发布时间】：2020-07-09 02:20:19
【问题描述】：

假设我有一份跟踪大学课程的申请。每门课程都有一些属性，如nametimenotesid。在应用程序中，用户可以添加/删除课程并编辑其属性。我将如何为此构建一个 redux 存储？

我的第一个想法是让状态成为一个映射对象，如下所示：

interface Course {
  id: string;
  name: string;
  time: string;
  notes: string;
}

interface StoreState {
  [id: string]: Course;
}

状态中的每个条目对应一个课程实例。然后，当用户添加新课程时，我会在状态中添加一个新条目

const slice = createSlice({
  name: 'courses',
  initialState: {},
  reducers: {
    addCourse: (state, action) => {
      state[action.payload.id] = {
        id: action.payload.id,
        name: action.payload.name,
        ...
        ...
      }
    },
    updateNotes: (state, action) => {
      state[action.payload.id].notes = action.payload.notes
    }
    ...
    ...
  }
})

这并不理想，因为在每种情况下我都必须重复使用课程 id 来更新正确的课程。我想在商店中为 each 课程有一个状态对象，并像这样编写我的案例缩减器：

    updateNotes: (state, action) => {
      state.notes = action.payload.notes
    }

我不必担心我要更新哪个课程，因为它们的功能都相同。有没有办法为共享相同 reducer 逻辑的每门课程动态创建状态？

【问题讨论】：

标签： javascript typescript redux redux-toolkit

【解决方案1】：

你需要实现 redux 的 combineReducers() 的动态版本。

似乎有一个包可以做到这一点：https://www.npmjs.com/package/redux-injector

【讨论】：

【解决方案2】：

看到这个，我认为你关心的是一个数据结构，其中ID 既是存储数据中的键又是属性，这打破了 Redux 中的数据存储应该是最小数据集的想法没有任何重复。

对此的解决方案是仅将 ID 存储为密钥，并使用名为 Reselect 的库在您从存储中获取密钥时将其合并回数据中。

https://github.com/reduxjs/reselect

【讨论】：