Javascript 错误：未设置QueryClient，请使用QueryClient Provider设置一个

我第一次尝试react查询，然后在我的react应用程序启动时得到了这个

虽然我在树的顶部添加了QueryClientProvider，但我仍然面临：

错误：未设置QueryClient，请使用QueryClientProvider设置一个

index.js

ReactDOM.render(
    <QueryClientProvider queryClient={queryClient}>
        <App />
    </QueryClientProvider>
  ,
  document.getElementById('root')

---

道具名称应该是

client

而不是

queryClient

 import { QueryClient, QueryClientProvider } from 'react-query' 

 const queryClient = new QueryClient()

 function App() {

   return <QueryClientProvider client={queryClient}>...</QueryClientProvider>

 }

从'react query'导入{QueryClient，QueryClientProvider}
const queryClient=new queryClient（）
函数App（）{
返回。。。
}

将版本从V3降级到V2解决了这个问题。

面临同样的问题。@mani\u thelearner我找到了它。当我添加此属性时，属性名称应该是

client

，而不是

queryClient

。我得到了这个错误：TypeError:Object不是这一行的函数：

const[createTodo，todoMutation]=useMutation（（event）=>{axios.post（'/todos'，event.target.elements.todo.value）；}）

最有可能是因为您以错误的方式使用了钩子？请看下面的链接

function Forms() {
    const[createTodo,todoMutation]= useMutation((event) => {
        axios.post('/todos', event.target.elements.todo.value);
    })

    return (

        <div>
            <form onSubmit={createTodo}>
                <label htmlFor="todo">todo-item:</label>
                <input id="todo" name="Add todo"/>
                <button>Submit</button>
            </form>
        </div>

    )
}

    "react": "17.0.1",
    "react-dom": "17.0.1",
    "react-query": "3.12.1",
    "react-scripts": "4.0.0"

 import { QueryClient, QueryClientProvider } from 'react-query' 

 const queryClient = new QueryClient()

 function App() {

   return <QueryClientProvider client={queryClient}>...</QueryClientProvider>

 }