Prefetch

패칭이 되는동안 로딩화면을 띄우길 원하지 않을 경우 사용하는 방법 : 미리 페이지를 패칭해서 캐싱 + 이전 페이지를 캐싱

 

1. 페이지네이션에서 미리 페이지를 패칭해서 캐싱하는 방법

: 다음 페이지를 패칭해서 캐싱한다.

  const queryClient = useQueryClient()
  useEffect(() => {   
    if(currentPage < maxPostPage){
      const nextPage = currentPage+1
      queryClient.prefetchQuery(['posts', nextPage], ()=>fetchPosts(nextPage))
    }  }, [currentPage,queryClient]) 

2. 이전 페이지를 캐싱하는 방법

: useQuery의 옵션 중 keepPreviousData를 true로 주어 활성화시킨다.

const {data, isError,error, isLoading}=useQuery(['posts',currentPage],()=>fetchPosts(currentPage), {staleTime:2000, keepPreviousData:true})