Перейти к содержимому

TanStack Query в Angular: так ли нужен весь этот шаблонный код NgRx? (Часть 1)

Code Forge

0:00 / 0:00

TanStack Query в Angular: так ли нужен весь этот шаблонный код NgRx? (Часть 1)

20 просмотров · 2 нед. назад
Code Forge
38 подписчиков
20 просмотров · 2 нед. назад
Представьте, что вам нужен всего лишь список постов из API. С NgRx это действие, эффект, редуктор и селектор. С TanStack Query это injectQuery, queryKey и queryFn. Мы создадим оба варианта на практике в Angular — типизация в реальном времени, построчное объяснение, а затем запустим их на реальном API. Это первая часть серии статей о TanStack Query (@tanstack/angular-query-experimental) в Angular. Рассматриваются следующие вопросы: проблема NgRx (кратко), что представляет собой TanStack Query, реальная установка, QueryClient и provideTanStackQuery, реальный многоразовый PostService, корректное объяснение injectQuery/queryKey/queryFn, HTML-шаблон и состояния запросов (isPending/isError/isSuccess/isFetching), работающая демонстрация, наиболее полезные параметры запросов (enabled/staleTime/retry/select/refetchOnWindowFocus) и объективное сравнение — TanStack Query не заменяет NgRx, он специализируется на управлении состоянием сервера. Примечание: поддержка Angular в TanStack Query поставляется под именем пакета @tanstack/angular-query-experimental — в основном он помечен как экспериментальный (возможны критические изменения в минорных/патч-релизах), поэтому зафиксируйте свою версию в продакшене. Требуется Angular 16+. Вторая часть (мутации, аннулирование кэша, оптимистичные обновления) будет следующей — подпишитесь, чтобы она появилась в вашей ленте. Что нам следует обсудить дальше: кэширование или мутации? Напишите в комментариях. #Angular #TanStackQuery #NgRx #StateManagement #WebDevelopment #TypeScript #CodeForge