调用 api 不起作用 nextjs getinitialprops

Question

我想使用 next getinitialprops 和 axios

从 api 获取一些数据

虽然我在这里添加的代码是 getInitialProps

但它不起作用

文件的路径是pages/index.tsx

IndexPage.getInitialProps = async (ctx: any) => {
  try {
    const res = await axios.get(
      "THE_PATH"
    );
    const restaurants = res.data;
    return { restaurants };
  } catch (error) {
    return { error };
  }
};

这是我尝试使用它的方式

const IndexPage = (props: any) => {

 <div
      onClick={() => {console.log(props)}}>

它不显示道具

我错过了什么

Answer 1

您需要将对象作为 {restaurant } 的值返回，而不是返回 props；

return {
    props: { restaurant }, // will be passed to the page component as props
}

<块引用>

props - 一个必需的对象，带有将由 页面组件。

参考

https://nextjs.org/docs/basic-features/data-fetching#getstaticprops-static-generation

https://nextjs.org/docs/basic-features/data-fetching#getserversideprops-server-side-rendering