运行@tanstack/react-query时遭遇未捕获运行时错误求助

错误原因 #

你用的是React Query v5，这个版本强制要求所有查询相关函数必须使用单一对象参数，而你代码里用的是旧版本的「数组+回调函数」多参数写法，因此触发报错。

错误信息翻译：

参数类型错误。从v5版本开始，调用查询相关函数时只允许使用“对象”形式。
请通过错误堆栈找到出错的调用位置。

修正后的代码 #

import { useQuery } from '@tanstack/react-query';
import Axios from "axios"

export const Home = () => {
  const { data } = useQuery({
    queryKey: ["cat"],
    queryFn: () => Axios.get("https://catfact.ninja/fact").then(res => res.data)
  });

  return (
    <h1>
      HOPE <p>{data?.fact}</p>
    </h1>
  )
}

修改说明 #

把原来的useQuery(["cat"], () => {...})调用方式，改成传入包含queryKey和queryFn属性的配置对象即可，这是React Query v5的强制要求。

内容的提问来源于stack exchange，提问作者Active-leopard-58a51d