const { data, isPending, error } = useQuery({
queryKey: ["orders", page],
queryFn: () => api.orders(page),
});
const mutation = useMutation({
mutationFn: api.cancelOrder,
onSuccess: () => queryClient.invalidateQueries({ queryKey: ["orders"] }),
});Что важно знать
- Данные с сервера — это кэш, а не состояние приложения: у него есть свежесть, повторы, обновление в фоне, инвалидация.
- Запрос в
useEffectс ручными флагами загрузки — источник гонок, дублирования и утечек; библиотека решает это из коробки. - Ключ запроса включает все параметры — смена страницы или фильтра автоматически загружает нужные данные.
- Оптимистичные обновления: показать результат сразу, откатить при ошибке.
- Альтернативы: RTK Query (в составе Redux Toolkit), SWR, загрузчики маршрутизатора.