在反应查询中使禁用的查询无效

Question

我尝试使用 react-query 将数据提取到表单中。

它默认是禁用的，因为这个表单也处理空表单（当没有从服务器加载默认值时，即：它是一个 CREATE 选项）。

它工作正常，但不是最好的方式。下次缓存会在那里，所以如果我再次加载页面，旧数据将可见，直到 refetch() 完成。

是否可以在离开页面时从缓存中删除？（它应该总是像第一次加载一样加载，当它没有任何用于此 queryKey 的缓存数据时）。

我试过使用 queryClient.removeQueries()，但似乎不起作用，我认为这是因为查询处于 disabled 状态。

    const {data, isError, isSuccess, isFetching, isIdle, refetch} = useQuery(queryKey, getProject(id), {
        enabled: false,
        retry: 2,
    });

Answer 1

看来正确的做法是将cacheTime设置为0。

如果 React re-renders 页面，将 cacheTime 设置为 0 将从缓存中完全删除查询。

    const {data, isError, isSuccess, isFetching, isIdle, refetch} = useQuery(queryKey, getProject(id), {
        enabled: false,
        retry: 2,
        cacheTime: 0
    });

在反应查询中使禁用的查询无效

Invalidate disabled query in react-query

reactjs

react-query