Що таке RTK Query в Redux Toolkit?

javascript

import { createApi, fetchBaseQuery } from "@reduxjs/toolkit/query/react";

export const api = createApi({
  baseQuery: fetchBaseQuery({ baseUrl: "/api" }),
  endpoints: (builder) => ({
    getUser: builder.query({
      query: (id) => `users/${id}`,
    }),
    updateUser: builder.mutation({
      query: ({ id, ...data }) => ({
        url: `users/${id}`,
        method: "PUT",
        body: data,
      }),
    }),
  }),
});

// Авто-генеровані hooks
export const { useGetUserQuery, useUpdateUserMutation } = api;

// Використання
function UserProfile({ id }) {
  const { data, isLoading } = useGetUserQuery(id);
  const [updateUser] = useUpdateUserMutation();
  
  if (isLoading) return <div>Завантаження...</div>;
  
  return <div>{data.name}</div>;
}

Коротка відповідь

Для співбесіди

Premium

Коротка відповідь допоможе вам впевнено відповідати на цю тему під час співбесіди.

Дочитали статтю?

Практика завдань