Question

我不认为getServerSideProps会运行，我只是刚开始，不知道如何解决此问题，尝试了几个小时，但仍然无法从IndexPage console.log（props.data）中获得定义。 >

export default function IndexPage(props) {
console.log(props.data.copyright);
    return (
        <>
         <div>{props.data.copyright}</div>
        </>
    )
}

export async function getServerSideProps() {
    const res = await fetch(" https://api.nasa.gov/planetary/apod?api_key=DEMO_KEY");
    const data = await res.json();
    return { props: { data } };
}

已编辑：该代码在本地计算机和vercel部署上完美运行，但在我最初开始/ headache的codeandbox.io上却无法运行

Answer 1

您必须使用React Hook，然后在其中调用该函数。然后，您可以将响应存储为状态

尝试这样的事情：

try-except1-except2...exceptN-else-finally

否则，您可以使用 import fetch from "isomorphic-unfetch"; import React, {useEffect} from "react" const IndexPage = props => { console.log(props.data); if(!props.data){ return <div>Waiting for data...</div> } return <div>main page</div>; }; export async function getServerSideProps() { const { API_URL } = process.env; console.log("inside fetch"); const res = await fetch(`${API_URL}/movies`); const data = await res.json(); return { props: { data } }; } export default IndexPage;然后确保在组件提取时数据就在那里。

如何在我的IndexPage中获取getServerSideProps结果？

1 个答案: