Что такое 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 идеален для случаев, когда нужно создать редьюсер без явного указания типов действий и хочется избавиться от шаблонного кода. Это делает код проще, чище и легче поддерживаемым, особенно для крупных проектов.