axios Swr API请求返回错误data.map不是reactjs中的函数

44u64gxh  于 2023-03-08  发布在  iOS
关注(0)|答案(2)|浏览(143)

我尝试使用useSWR()库从API使用,并且要返回的数据是对象数组,因此我决定首先尝试axios方法,通过执行以下操作来发出请求

const fetcher = (url) => axios.get(url).then((resp) => resp.json());

但是这个fetcher不起作用,所以我尝试使用fetch方法,我注意到数据被检索到了,但是我尝试Map,它给了我一个错误,说data.map不是一个函数。

const fetcher = (...args) => fetch(...args).then((resp) => resp.json());

    function Swr() {
    const { data, error } = useSWR(
        "https://callcaree.herokuapp.com/api/member",
        fetcher,
        { suspense: true }
       );

      //the data
      console.log(data);

      if (error) {
        return <h1> There was an error!</h1>;
      }

      return (
        <div>
          {data?.map((props) => {
            <div key={props._id}>
              <h3>{props.title}</h3>
           </div>;
          })}
        </div>
      );
    }
quhf5bfb

quhf5bfb1#

这显示了错误,因为用于Map的数据不是数组,它的对象,数据中有数据,该数据中有另一个数据,必须使用该数据进行Map,我编写了code in sandbox,以便您更好地理解它

import axios from "axios";
import useSWR from "swr";

export default function App() {
const fetcher = (url) => axios.get(url).then((resp) => resp);

const { data, error } = useSWR(
"https://callcaree.herokuapp.com/api/member",
  fetcher,
  {
    suspense: true
  }
);
if (error) {
  return <h1> There was an error!</h1>;
}

return (
  <div>
    {data.data.data.map((props) => {
      return (
        <div key={props._id}>
          <h3>{props.name}</h3>
        </div>
      );
    })}
  </div>
);
}
kupeojn6

kupeojn62#

我有一个类似的问题后,变异它,修复了调用

mutate([])

代替

mutate()

相关问题