如何一次全局处理所有反应查询的错误并重新获取？

Question

例如，我想处理当前在我的反应应用程序中运行的所有查询的过期访问令牌错误。

1. 我需要捕获全局过期的访问令牌错误
2. 取消其他查询很快就会抛出相同的错误
3. 更新上下文中的访问令牌
4. 使所有失败/取消的查询无效并使用新的访问令牌重新获取。

React Query 是否提供了一种方法来做到这一点？您能展示一下如何实现这一目标的简单示例吗？

Answer 1

React Query 在 QueryCache 和 MutationCache 级别上有全局事件处理程序，它们是使用 QueryClient 创建的：

const queryClient = new QueryClient({
  queryCache: new QueryCache({
    onSuccess,
    onError,
  }),
  mutationCache: new MutationCache({
    onSuccess,
    onError,
  })
})

对于每个查询/突变，这些事件处理程序将在每个查询/突变中被调用一次。

也可以看看：

• https://tanstack.com/query/v4/docs/react/reference/QueryCache#global-callbacks
• https://tanstack.com/query/v4/docs/react/reference/MutationCache#global-callbacks
• https://tkdodo.eu/blog/react-query-error-handling#the-global-callbacks