从React query中的另一个查询的重试中提取不同的查询

import { useInfiniteQuery } from 'react-query';

const fetchPosts = async (page = 1) => {
  const response = await fetch(`api/posts?page=${page}`);
  const data = await response.json();
  return data;
};

const PostList = () => {
  const { data, fetchNextPage, hasNextPage, isFetchingNextPage } = useInfiniteQuery(
    'posts',
    ({ pageParam = 1 }) => fetchPosts(pageParam),
    {
      getNextPageParam: (lastPage) => lastPage.nextPage, // 根据上一页的数据返回下一页的参数
    }
  );

  return (
    <div>
      {data.pages.map((page, index) => (
        <React.Fragment key={index}>
          {page.posts.map((post) => (
            <div key={post.id}>{post.title}</div>
          ))}
        </React.Fragment>
      ))}

      {hasNextPage && (
        <button onClick={() => fetchNextPage()} disabled={isFetchingNextPage}>
          {isFetchingNextPage ? '加载中...' : '加载更多'}
        </button>
      )}
    </div>
  );
};