쿼리 키

• 종속성
  • ex) ['comments', post.id]
  • 배열의 두번째 인자가 종속성
  • 각각의 post.id는 개별적인 staleTime과 캐시 시간을 갖는다.
  • 종속성 배열이 다르면 완전히 다른 것으로 간주!

    때문에 데이터를 가져올 때 쓰는 쿼리 함수의 모든 값은 키의 일부여야 함

Pagination

• 현재 컴포넌트 상태, 특히 현재 페이지 컴포넌트 상태를 사용하여 현재 페이지 추적
• 각 페이지마다 페이지 숫자 정보를 갖는 다른 쿼리 키를 사용 ex_ ['posts', currentPage]
• 사용자가 'next page' 또는 'previous page' 버튼을 클릭했을 때
  • currentPage를 업데이트
  • 쿼리 키의 변화를 react-query가 감지하고 새 쿼리를 실행

Prefetching

• 미리 데이터를 캐시에 추가
• 기본적으로 stale로 간주
• 데이터를 사용해야 할 때, 그 데이터는 여전히 stale 상태라서 다시 데이터를 가져옴
• 하지만 데이터를 다시 가져오는 동안, react-query는 캐시에 있는 데이터를 우선 제공
  • 물론 캐시가 만료되지 않은 상황에서!

prefetching은 pagination뿐 아니라, 사용자가 원하는 모든 데이터에 사용할 수 있다.