为什么在React Query中staleTime设置为Infinity并且cacheTime设置为零时数据不会重新获取

Question

我开始学习ReactQuery。我读过多篇文章，其中提到当 staleTime: Infinity 和 cacheTime: 0 时，数据不会重新获取。我想了解这是如何工作的。 根据我的理解，cacheTime 是数据在被垃圾收集/删除之前保留在缓存中的时间。在这种情况下，由于cacheTime设置为零，当有组件卸载时，缓存的数据会立即被垃圾收集。 现在，如果有窗口重新聚焦（或任何触发点），因为没有数据可以从缓存中获取，那么如何才能不重新获取并且仍然有数据呢？

我阅读了多篇有关 React Query 的文章，但无法自拔。

Answer 1

我认为您描述所学内容的方式缺少细节。这就是查询已挂载。

function Component() {
  useQuery({
    cacheTime: 0,
    staleTime: Infinity
  })
}

只要

Component

是mounted，查询就不会重新获取。更新时它将继续返回陈旧数据。

但是，当查询卸载（意味着组件卸载）时，缓存时间将启动并清除内存中的数据。下次安装组件时，它将必须按照您的预期重新获取。

那么，

{
  cacheTime: 0,
  staleTime: Infinity
}

不重新获取已安装的查询。