带有axios的Nextjs返回承诺待定[重复]

t3irkdon 于 2022-11-05 发布在 iOS

关注(0)|答案(1)|浏览(182)

此问题在此处已有答案：

How do I return the response from an asynchronous call?（44个答案）
上个月关门了。
我尝试在nextjs中使用axios从一个免费的api https://catfact.ninja/fact中获取一些数据，但得到的承诺待定。
httpClient.js:

import axios from "axios";

const GET_CATS = "https://catfact.ninja/fact";

export const getCats = async () => {
  try {
    return await axios.get(GET_CATS);
  } catch (e) {
    console.log("ERROR", e.message);
  }
};

index.js:

import { getCats } from "./api/httpClient";

const Home = ({ data }) => {
  console.log(getCats());
  return <div></div>;
};

export default Home;

所以我很困惑为什么承诺没有解决，因为我已经在httpClient.js中asyncawait API调用

axios

来源：https://stackoverflow.com/questions/73954655/nextjs-with-axios-return-promise-pending

1条答案

按热度按时间

pbpqsu0x1#

正如评论者所说--您并不是在等待组件中的结果。getCats返回一个承诺，因此当它被实现时，您需要对结果做一些事情：

import { useState } from "react";
import { getCats } from "./api/httpClient";

const Home = () => {
  const [data, setData] = useState(null);

  useEffect(() => {
    getCats().then(result => setData(result.data));
  }, []);

  return <div>{data?.fact}</div>;
};

export default Home;

赞(0）回复(0）举报 2022-11-05

我来回答

带有axios的Nextjs返回承诺待定[重复]

1条答案

相关问题

热门标签

最新问答