Как получить результаты getServerSideProps в моей IndexPage? - PullRequest
Новая
       7

Как получить результаты getServerSideProps в моей IndexPage?

1 голос
/ 28 мая 2020

Я не думаю, что getServerSideProps запускается, я только начинаю и понятия не имею, как это исправить, пытался несколько часов, но все еще получаю undefined из 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, но не на codeandbox.io, где я изначально начал / headache

1 Ответ

0 голосов
/ 28 мая 2020

Вы должны использовать React Hook, а затем вызвать функцию внутри него. Затем вы можете сохранить ответ в состоянии

Попробуйте что-то вроде этого: 

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;

В противном случае вы можете использовать getStaticProps Тогда вы уверены, что данные есть, когда компонент извлекает ..

...