Что такое createReducer и как его использовать?

createReducer — это функция, предоставляемая Redux Toolkit, которая позволяет создавать редьюсеры без явного указания типа действий. Вместо традиционного подхода с ручным созданием типа действия и обработки каждого из них в редьюсере, createReducer позволяет сразу привязать действия к изменению состояния с помощью объекта, где ключи — это типы действий, а значения — редьюсеры.

Как работает createReducer:

createReducer принимает два аргумента:

- Начальное состояние.

- Объект, где ключами являются типы действий, а значениями — функции, изменяющие состояние.

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

Пример использования createReducer:

import { createReducer } from '@reduxjs/toolkit';

const initialState = [];

const todosReducer = createReducer(initialState, {
  ADD_TODO: (state, action) => {
    state.push(action.payload); // Добавление задачи
  },
  REMOVE_TODO: (state, action) => {
    return state.filter(todo => todo.id !== action.payload); // Удаление задачи
  }
});

export default todosReducer;

Преимущества createReducer:

- Чистота кода: Редьюсеры выглядят компактнее, так как не нужно явно указывать switch и типы действий.

- Автоматическая иммутабельность: Внутри редьюсера применяется библиотека Immer, которая позволяет изменять состояние "мутируемо", но фактически оно остается неизменным.

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

Как использовать в store:

import { configureStore } from '@reduxjs/toolkit';
import todosReducer from './todosReducer';

const store = configureStore({
  reducer: {
    todos: todosReducer
  }
});

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