Как повторно использовать Redux reducer logi c для нескольких экземпляров одного и того же типа данных? - PullRequest
3 голосов
/ 09 июля 2020

Допустим, у меня есть приложение для отслеживания университетских курсов. Каждый курс имеет некоторые атрибуты, например name time notes id. В приложении пользователь может добавлять / удалять курсы и редактировать их атрибуты. Как мне структурировать хранилище 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 в каждом случае reducer для обновления правильного курс. Я хотел бы иметь объект состояния в магазине для каждого курса и писать свои редукторы случаев следующим образом:

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

Мне не нужно беспокоиться о том, какой курс я ' m, потому что все они работают одинаково. Есть ли способ динамически создавать состояния для каждого курса с одним и тем же логом редуктора c?

Ответы [ 2 ]

2 голосов
/ 09 июля 2020

Вам необходимо реализовать динамическую c версию метода redux combReducers ().

Кажется, существует пакет, который делает это: https://www.npmjs.com/package/redux-injector

0 голосов
/ 19 июля 2020

Глядя на это, я думаю, что вас беспокоит в конечном итоге структура данных, где ID является одновременно ключом и свойством в ваших сохраненных данных, и это разрушает идею о том, что хранилище данных в Redux должно быть минимальным набором данных без каких-либо повторений.

Решением этого является сохранение только идентификатора в качестве ключа и использование библиотеки с именем Reselect для слияния ключа с данными, когда вы берете его из магазина.

https://github.com/reduxjs/reselect

...