React 查询 - 无法通过 'getQueryData' 访问数据，始终 returns 未定义

Question

我是第一次尝试 React Query，我写了这个：

export function Component(): JSX.Element {
  const queryClient = new QueryClient()

  const { data } = useQuery<DataType>({
    queryKey: "myKey",
    queryFn: () => ....,
  })

  const sameData: DataType| undefined = queryClient.getQueryData("myKey")

  return (
    <>
      {console.log(data)}
      {console.log(sameData)}
      <p>Loaded, see console for values.</p>
    </>
  )
}

数据对象按预期创建，但我似乎无法使 sameData return 除了未定义之外的任何内容。我知道这意味着 React Query 没有找到我的密钥。有人知道如何解决这个问题吗？

Answer 1

您将在每次渲染中创建一个新的 QueryClient，因此您将获得一个新的缓存。查看文档首页上的示例：https://react-query.tanstack.com/overview

你需要一个稳定的queryClient，把它放在一个QueryClientProvider中

React 查询 - 无法通过 'getQueryData' 访问数据，始终 returns 未定义

React Query - unable to access the data via 'getQueryData', always returns undefined

reactjs

react-query