Error: No QueryClient set, use QueryClientProvider to set one ,But i did

Question

我刚开始按照文档对查询做出反应，我得到了我正确实施的问题，感谢帮助

错误：

Error: No QueryClient set, use QueryClientProvider to set one

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>
      )
    }

Answer 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
}

Error: No QueryClient set, use QueryClientProvider to set one ,But i did

Error: No QueryClient set, use QueryClientProvider to set one ,But i did

javascript

api

reactjs

axios

react-query