Function MyComponent

packages/react-query/src/__tests__/useInfiniteQuery.test.tsx:1793–1826

()

    }

    function MyComponent() {
      useTrackRenders()
      const fetchCountRef = React.useRef(0)
      const query = useInfiniteQuery({
        queryFn: ({ pageParam }): Promise<Result> =>
          sleep(10).then(() => ({
            items: [...new Array(10)]
              .fill(null)
              .map((_, d) => pageParam * pageSize + d),
            nextId: pageParam + 1,
            prevId: pageParam - 1,
            ts: fetchCountRef.current++,
          })),
        getNextPageParam: (lastPage) => lastPage.nextId,
        initialPageParam: 0,
        queryKey: key,
      })
      const data = React.use(query.promise)
      return (
        <>
          {data.pages.map((page, index) => (
            <React.Fragment key={page.ts}>
              <div>
                <div>Page: {index + 1}</div>
              </div>
              {page.items.map((item) => (
                <p key={item}>Item: {item}</p>
              ))}
            </React.Fragment>
          ))}
          <button onClick={() => query.fetchNextPage()}>fetchNextPage</button>
        </>
      )
    }

    function Page() {
      useTrackRenders()