Глава 38. Сложное состояние: Zustand и Redux Toolkit

Зачем эта глава

Когда приложение растёт, становится неудобно хранить всё в useState. Для этого используют внешние менеджеры состояния.

Zustand (простой вариант)

import { create } from "zustand";

const useCart = create((set) => ({
  items: [],
  add: (item) => set((state) => ({ items: [...state.items, item] }))
}));

Redux Toolkit (стандарт)

import { createSlice } from "@reduxjs/toolkit";

const cartSlice = createSlice({
  name: "cart",
  initialState: [],
  reducers: {
    addItem: (state, action) => { state.push(action.payload); }
  }
});

Важно: в небольших проектах Zustand проще. В больших — чаще используют Redux Toolkit.

Задания

Задание: корзина

Создай store корзины.
Добавь действие add.
Выведи количество товаров.

← Предыдущая Следующая глава →