React-query，查询不更新参数

Question

我使用react-query图书馆来获取我的数据。当用户发生变化时，如果自动删除以前的用户数据并获取新数据，我会很高兴。

但这确实不会发生，API 会使用旧的 userId 被调用几次，并且只有在重新关注应用程序 1 或 2 次之后，它才会使用正确的 new 来获取数据userId。这是挂钩：当我在函数中记录一些信息时getData，我可以看到注销后使用旧的 userId 调用了几次。

export default function useData() {
    const {user} = useAuth();
    const queryClient = useQueryClient();
    useEffect(() => {
        queryClient.removeQueries('data')
        queryClient.invalidateQueries()
    }, [user]);
    return useQuery('data', () => getData(user!.uid), {
        enabled: !!user,
    })
}

有谁知道我如何在user更改时删除所有数据？

Answer 1

查询的所有依赖项都应该位于查询键中，因为当键更改时，react-query 会自动重新获取。这也在此处的文档中。

在您的情况下，这意味着添加用户 ID：

useQuery(
  ['data', user?.uid],
  () => getData(user!.uid),
  {
    enabled: !!user,
  }
)

为了清除旧的缓存条目，我可能建议cacheTime: 0对您的查询进行设置，这意味着一旦最后一个观察者卸载，它们就会被垃圾收集。手动呼叫queryClient.removeQueries也是一种选择。