当需求需要走其他路径时如何触发重新获取？

Question

到目前为止，我可以在子组件上传递 refetch 函数。问题是当我必须转到其他页面并使用 redux 时。（打开新路径对话框 link）。在该页面中，我将触发此重新获取功能。而 redux 肯定不能保存函数 refetch。解决这个问题的正确方法是什么？

 const { data: getWorkerGroupsResponse, refetch } = useQuery(
  'get-worker-group',
   async () => getWorkerGroups(projectId as string),
   {
      enabled: !!projectId,
   },
  );

在上面的代码中，我必须将重新获取传递给其他页面。

Answer 1

React 查询会在查询键更改时自动处理重新获取。您不应该仅仅因为 ID 已更改就需要调用 refetch。

您的组件中有一个错误，即查询键不包含 id，因此从 RQ 的角度来看，只有一个查询。如果你引入它，即使不手动重新获取也可以：

const { data: getWorkerGroupsResponse, refetch } = useQuery(
  ['get-worker-group', projectId], // projectId should be part of queryKey
  async () => getWorkerGroups(projectId as string),
  {
    enabled: !!projectId,
  },
);

现在，当 projectId 发生变化时，React 查询会发现您提供的 queryKey 发生了变化，并将使用新值重新运行查询。

当需求需要走其他路径时如何触发重新获取？

How to trigger refetch when the requirement need to go other path?

typescript

react-query