Блог

Я изучаю React и Redux, так что я всего лишь новичок. Я предпочитаю использовать инструментарий Redux вместо чистого Redux.

Я создаю приложение, которое управляет таблицами данных, и, поскольку я использую инструментарий Redux, я создал срез хранилища, в котором я определяю редукторы, которые также генерируют действия. Я структурировал свое состояние в соответствии с документацией redux о нормализованном состоянии и адаптировал ее к своему варианту использования: https://redux.js.org/usage/structuring-reducers/normalizing-state-shape.

Состояние среза выглядит следующим образом:

 interface ITableState {
  entities: {
    columns: IColumnsState;
    rows: IRowsState;
    cells: ICellsState;
    columnCell: IColumnCellState;
    rowCell: IRowCellState;
  }
  ui: ITableUIState;
}
 

где каждое состояние сущности находится в форме:

 state: {
  byId: {
    ...
  },
  allIds: [...]
}
 

Теперь к вопросу. Насколько конкретными должны быть мои функции редуктора?

Приложение должно выполнять такие действия, как обновление ячейки, обновление столбца, удаление ячейки, удаление столбца, выбор строки и так далее. Но бывают случаи, когда, когда я обновляю ячейку, это приводит к изменению какой-либо другой части состояния, и если функция реализована более общим способом, она должна проверяться для каждого конкретного случая.

Пример:

 updateCell = (state, action) => {
   const { cellId, value } = action.payload
   
   // I'm using RTK so I can "mutate" the state
   state.cells[cellId] = value;
   
   if (all cells of a row have value) {
      // also update row label
   }

   if (some other case) {
      // also do something else
   }
   ...
}
 

Если функции редуктора более специфичны для каждого случая, мне не нужно проверять, что обновлять, но у меня было бы намного больше редукторов.