小编Ver*_*ido的帖子

我正在使用 MUI X Data Grid v5 和 Tanstack React Query v4 我尝试在 Datagrid 组件上使用分页，当页面最初加载时，它会按预期正常获取并加载网格。当我点击进入网格的下一页时，问题就出现了，我尝试通过向我的 api 发送跳转来重新获取数据。api 没有问题，它可以正确获取下一组数据。然而，在Datagrid中，它只渲染结果集的最后一条记录。在我的控制台和网络响应中，我看到一个包含正确数量记录的数组。如果我向后导航，它将立即呈现所有“丢失”的行，但然后继续获取 onPageChange 并正确呈现所有记录。

代码沙箱链接：

这是我尝试过的：

const ApprovalGrid = () => {
  const authorization= useContext(AuthorizationContext);
  const [skip, setSkip] = useState(0);
  const [page, setPage] = useState(0);
  const pageSize = 10;
  const fetchData = async () => {
    return await doFetch(
      '/get/approvals', {
        query: {pageSize: pageSize, skip: skip },
      }),
      authorization,
    );
  };

  const { data, isLoading, isFetching, isRefetching, refetch } = useQuery(
    ['Approvals-viewAll', page],
    async () …