译零 TransZero · TanStack Query v3 中文文档
主站

预取数据 prefetching

如果您足够幸运,那么您可能对用户将做的事情有足够的了解,以便能够在需要之前预取他们所需的数据! 在这种情况下,可以使用prefetchQuery方法预取要放入缓存的查询结果:

JavaScript
1const prefetchTodos = async () => {2  // 该查询的结果将像普通查询一样被缓存3  await queryClient.prefetchQuery("todos", fetchTodos);4};
  • 如果此查询的数据已经在缓存中并且没有失效,则将不会获取该数据
  • 如果一个staleTime被传递,例如: prefetchQuery('todos', fn, {staleTime:5000})并且数据早于指定的 staleTime,则查询将去尝试获取新值
  • 如果一个预取的查询没有出现useQuery实例,则将在cacheTime指定的时间之后被删除并被垃圾回收

手动启动一个查询

或者,如果您已经有同步可用的查询数据,则无需预取。 您可以只使用Query Client 的setQueryData方法直接按键值添加或更新查询的缓存结果。

JavaScript
1queryClient.setQueryData("todos", todos);

本页为 TanStack Query 文档(React 版)的非官方中文翻译,原文由上游团队维护,遵循 MIT 许可。 译文如有偏差,以英文原文为准。

本页译文取自社区中文版 react-query-web-i18n(MIT),非本站翻译,已停止更新,内容可能与当前 API 有出入。

译自上游 (未记录版本)