QueryClient | TanStack Query Docs

QueryClient란?

QueryCline는 쿼리를 관리하고 캐시하는데 사용되는 핵심 객체 이다.

이 객체는 전체 애플리케이션에서 사용되는 쿼리 인스턴스를 관리하고, 캐시된 데이터를 추적하며, 쿼리와 관련된 다양한 작업을 수행한다.

QueryClient를 이용해서 할수 있는 것들

  1. 쿼리 실행 : ‘queryClient’를 사용하여 새로운 쿼리를 실행하거나 이전에 실행된 쿼리를 다시 실행할 수 있다. 이를 통해 데이터를 요청하고 캐시에 저장할 수 있다.
  2. 캐시된 데이터 액세스 : ‘queryClient’를 사용하여 캐시된 데이터에 액세스할 수 있다. 이전에 성공적으로 실행된 쿼리의 결과를 얻을 수 있다.
  3. 캐시 업데이트 : ‘queryClient’를 사용하여 캐시된 데이터를 업데이트하거나 재검색할 수 있다. 이를 통해 최신 데이터로 업데이트된 쿼리 결과를 받을 수 있다.
  4. 캐시 인벨리데이션 : ‘queryClient’를 사용하여 캐시된 데이터를 무효화하고 새로운 데이터를 가져올 수 있다. 이를 통해 데이터의 유효성을 유지하고 최신 데이터를 유지할 수 있다.
  5. 쿼리 상태 관리 : ‘queryClient’를 사용하여 쿼리의 상태를 관리할 수 있다. 로딩 중인지, 에러가 발생했는지 등의 상태를 추적할 수 있다.

‘queryClient’는 ‘react-query’ 패키지의 핵심 요소 중 하나이며, 애플리케이션에서 데이터를 효과적으로 관리하고 업데이트하는 데 중요한 역할을 한다.

import { QueryClient } from '@tanstack/react-query'

const queryClient = new QueryClient({
  defaultOptions: {
    queries: {
      staleTime: Infinity,
    },
  },
})

await queryClient.prefetchQuery({ queryKey: ['posts'], queryFn: fetchPosts })