错误：没有设置 QueryClient，使用 QueryClientProvider 设置一个，但我做了答案

【问题标题】：Error: No QueryClient set, use QueryClientProvider to set one ,But i did错误：没有设置 QueryClient，使用 QueryClientProvider 设置一个，但我做了
【发布时间】：2021-08-02 15:13:39
【问题描述】：

我是按照文档对查询做出反应的新手，我得到了我正确实施的问题，感谢您的帮助

错误：

错误：没有设置QueryClient，使用QueryClientProvider设置一个

import { QueryClient, QueryClientProvider, useQuery } from 'react-query'
import axios from 'axios';


    const queryClient = new QueryClient()
    
    export default function App() {
      const queryInfo =
        useQuery('pokemon', () => axios
          .get('https://pokeapi.com/api/v2/pokemon')
          .then(res => res.data.results))
    
      return (
        <QueryClientProvider client={queryClient}>
          {queryInfo.data?.map(result => {
            return <div key={result.name}>{result.name}</div>
          })}
        </QueryClientProvider>
      )
    }

【问题讨论】：

search results for the error message 都没有帮助解决问题？

标签： javascript reactjs api axios react-query

【解决方案1】：

您已经创建了queryClient，但您仍在使用useQuery 在<QueryClientProvider> 之外。对useQuery 的每次调用都必须在提供者内部：

const queryClient = new QueryClient()
export default function App() {
return (
  <QueryClientProvider client={queryClient}>
    <Something />
  </QueryClientProvider>
}

function Something() {
  const queryInfo =
    useQuery('pokemon', () => axios
      .get('https://pokeapi.com/api/v2/pokemon')
      .then(res => res.data.results))

  return queryInfo.data?.map(result => {
    return <div key={result.name}>{result.name}</div>
  }) ?? null
}

【讨论】：

SSSSSStonksssssss