intermediate
Store slices
Делите крупные store на связные slices, сохраняя ясное владение actions и зависимости между slices.
Большие Zustand store делят на slice — фабрики, получающие `set`, `get` и сливающиеся в одно состояние `create`. Каждый slice владеет actions и полями фичи.
import { create } from 'zustand';
const createBearSlice = (set) => ({
bears: 0,
addBear: () => set((s) => ({ bears: s.bears + 1 })),
});
const createFishSlice = (set) => ({
fish: 0,
addFish: () => set((s) => ({ fish: s.fish + 1 })),
});
const useStore = create((...args) => ({
...createBearSlice(...args),
...createFishSlice(...args),
}));
Межслайсовое чтение — через `get()` внутри actions. Избегайте циклических зависимостей; выносите общие хелперы.
Компромисс: модульные store против стоимости координации, когда slices делят производные или персистентные поля.
На интервью: границы slice против нескольких отдельных store.
Типовые ошибки: slice неформально меняют чужую форму, коллизии имён при merge, anti-pattern «божественный» slice.
Чеклист:
- Один create с составными slice.
- Ясное владение action на slice.
- get() для координации между slice.
- Отдельные store только при разном lifecycle.