Ответ
RTK Query упрощает работу с API, предоставляя готовые инструменты для кэширования, инвалидации, оптимистичных обновлений и автоматической генерации хуков.
Ключевые преимущества:
- Автогенерация хуков – создает
useGetPostsQuery,useAddPostMutationи т.д. - Кэширование – автоматически управляет данными, избегая лишних запросов.
- Инвалидация –
invalidateTagsперезапрашивает данные при изменении. - Оптимистичные обновления –
onQueryStartedв мутациях позволяет мгновенно обновлять UI. - Минимум кода – не нужно писать редьюсеры, экшены, санки.
Пример:
// apiSlice.ts
const api = createApi({
endpoints: (build) => ({
getPosts: build.query<Post[], void>({
query: () => 'posts',
}),
addPost: build.mutation<Post, Partial<Post>>({
query: (body) => ({
url: 'posts',
method: 'POST',
body,
}),
}),
}),
});
// Компонент
const { data, isLoading } = useGetPostsQuery();
const [addPost] = useAddPostMutation();Ответ 18+ 🔞
Слушай, ну это ж просто пиздец какой-то, а не библиотека! RTK Query, блядь. Сидишь ты такой, пишешь эти бесконечные редьюсеры, экшены, санки... Руки уже отваливаются, а тут — бац! — и тебе подсовывают эту штуку.
В чём, сука, магия-то?
- Хуки из воздуха, блядь! Написал эндпоинт — получил
useGetPostsQueryиuseAddPostMutation. Ни хуя не нужно выдумывать, всё само генерируется, ёпта! - Кэширование, которое не ебет мозг. Сам всё запоминает, не дергает сервер почём зря. Данные есть? Сиди, не рыпайся, получай из кэша, как из своего кармана.
- Инвалидация по тегам. Сделал мутацию, обновил что-то — крикнул
invalidateTags(['Posts']), и всё, что связано с постами, само собой перезапросится. Красота, а не жизнь! - Оптимистичные обновления — это просто песня, блядь. В
onQueryStartedмутации нафантазировал, как UI должен выглядеть прямо сейчас, и он так и выглядит, пока запрос летит. Пользователь счастлив, ты не выглядишь лузером. - Кода — в рот меня чих-пых — минимум. Никаких этих твоих switch-case, тонн бойлерплейта. Описал, что хочешь получить и отправить — и пошёл пить чай.
Смотри, как это выглядит, ёбана:
// apiSlice.ts — тут мы, блядь, богами становимся
const api = createApi({
endpoints: (build) => ({
getPosts: build.query<Post[], void>({
query: () => 'posts', // Просто говорим: "дай посты"
}),
addPost: build.mutation<Post, Partial<Post>>({
query: (body) => ({
url: 'posts',
method: 'POST',
body, // Говорим: "вот, на, новый пост создай"
}),
}),
}),
});
// А в компоненте — вообще сказка, блядь!
const { data, isLoading } = useGetPostsQuery(); // Взял и вызвал, как обычный хук!
const [addPost] = useAddPostMutation(); // И мутацию тоже!Вот и вся работа, ёпта! Раньше на это уходило полдня и три пачки валерьянки, а теперь — пять строчек кода и чувство глубокого морального удовлетворения. Просто охуенно!