React Native 中忽略了 React Query CacheTime

Question

我正在尝试预取主屏幕上的一些数据，以便当用户转到那里时显示在不同的屏幕（搜索屏幕）上。我试图将

cacheTime

设置为 24 小时，所以它基本上每天只会获取一次。据我了解，默认情况下，Tanstack Query 将在 5 分钟后垃圾收集尚未被“useQuery”命中的任何查询。但发生的情况是，当我第一次登陆主屏幕时，会发生预取，当我进入搜索页面时，结果会立即出现。但是，如果我返回主屏幕并让它闲置 5 分钟，然后返回搜索，我会看到一个加载屏幕并已验证它正在重新运行查询。

这就是我所得到的：

// called on the home screen
export default async function prefetchMostFrequentResults(bar) {
  const queryClient = useQueryClient();

  await queryClient.prefetchQuery({
    queryKey: ["foo", bar],
    queryFn: async () => {
      // irrelevant implementation detail
    },
    staleTime: 43200000, // 12 hours
    cacheTime: 86400000, // 24 hours
  });
}

在我的搜索屏幕上：

export default function useMostFrequentResults(bar) {
  return {
    ...useQuery({
      queryKey: ["foo", bar],
      queryFn: async () => {...}
      staleTime: 43200000, // 12 hours
      cacheTime: 86400000, // 24 hours
      refetchOnMount: false,
    }),
  };
}

我已验证依赖键

bar

在此期间没有更改，并且在主屏幕闲置时没有任何内容调用

invalidateQueries

。

我知道空闲 5 分钟听起来很做作，但本质上发生的情况是结果在冷启动后被预取，然后每次我将应用程序置于后台并在数小时后返回时，我总是会先得到它加载屏幕。

这可能是反应查询如何与反应本机交互的一些利基错误/边缘情况吗？

Answer 1

你找到答案了吗？它也发生在我的react-js代码中。