๐Ÿ‘€ Suspensive v2์—์„œ์˜ ๋ณ€๊ฒฝ์„ ํ™•์ธํ•˜์„ธ์š”. ๋”๋ณด๊ธฐ โ†’
๋ฌธ์„œ๋ณด๊ธฐ@suspensive/react-queryusePrefetchInfiniteQuery

usePrefetchInfiniteQuery

usePrefetchInfiniteQuery๋Š” ์•„๋ฌด๊ฒƒ๋„ ๋ฐ˜ํ™˜ํ•˜์ง€ ์•Š์œผ๋ฉฐ, useSuspenseInfiniteQuery๋ฅผ ์‚ฌ์šฉํ•˜๋Š” ์ปดํฌ๋„ŒํŠธ๋ฅผ ๋ž˜ํ•‘ํ•˜๋Š” suspense boundary๊ฐ€ ๋ Œ๋” ๋˜๊ธฐ์ „์— prefetch๋ฅผ ๋ฐœ์ƒ์‹œํ‚ค๋Š” ๋ฐ์— ์‚ฌ์šฉํ•ฉ๋‹ˆ๋‹ค.

import {
  usePrefetchInfiniteQuery,
  useSuspenseInfiniteQuery,
} from '@suspensive/react-query'
 
const PostsPage = ({ postId }) => {
  usePrefetchInfiniteQuery({
    queryKey: ['posts'],
    queryFn: () => getPosts(),
  }) // suspense ๊ฒฝ๊ณ„ ์ „์— prefetch๋ฅผ ๋ฐœ์ƒ ์‹œํ‚ค๋Š” ๋ฐ์— ์‚ฌ์šฉํ•ฉ๋‹ˆ๋‹ค
 
  return (
    <Suspense fallback={<div>Loading...</div>}>
      <Posts />
    </Suspense>
  )
}
 
export const Posts = () => {
  const postsInifiniteQuery = useSuspenseInfiniteQuery({
    queryKey: ['posts'],
    queryFn: () => getPosts(),
  })
 
  return <>...</>
}