Wie übergebe ich asynchron über getServerSideProps erhaltene Daten an eine Komponente in Next.js?
P粉511749537
P粉511749537 2023-09-11 23:13:27
0
1
378

Vielen Dank für Ihre Teilnahme an der Frage! Ich lerne immer noch und muss es mir vielleicht wie einem 5-Jährigen erklären.

Toller Arbeitsplatz:

Auf meiner Homepage erhalte ich die Daten von getServerSideProps und ordne sie zu. Die Daten werden von data.json im Projektordner abgerufen.

Exportieren Sie die Standardfunktion Homepage({ data }) { ... }

Asynchrone Funktion getServerSideProps() { ... } exportieren

Homepage hat Mapping-Funktion 1... Das funktioniert bei mir gut!

Was möchte ich tun:

Jetzt möchte ich innerhalb der Komponente namens ListComponent auf die von getServerSideProps() erhaltenen Daten zugreifen.

Ich möchte die Originaldaten in Mapping-Funktion 2 wieder verwenden. Ich möchte, dass dies innerhalb der ListComponent geschieht.

Die ListComponent wird dann in meine Homepage importiert.

Was nicht funktioniert:

Innerhalb der ListComponent habe ich versucht, dieselben Daten zu übergeben, die ich auf der Startseite verwende, etwa so:

Exportieren Sie die Standardfunktion ListComponent({ data }) { ... }

Aber es hat nicht funktioniert. Es heißt, dass die Daten undefiniert sind oder nicht gelesen werden können. Warum passiert das? Wie übergebe ich Daten an ListComponent?

P粉511749537
P粉511749537

Antworte allen(1)
P粉006847750

你只需要将数据作为props传递:

export default function Homepage({ data }) {
  return (
   // ...
   <ListComponent data={data} />
   // ...
  )
}

现在,你有了名为data的props:

export default function ListComponent({ data }) { 
  // 使用数据
}
Beliebte Tutorials
Mehr>
Neueste Downloads
Mehr>
Web-Effekte
Quellcode der Website
Website-Materialien
Frontend-Vorlage
Über uns Haftungsausschluss Sitemap
Chinesische PHP-Website:Online-PHP-Schulung für das Gemeinwohl,Helfen Sie PHP-Lernenden, sich schnell weiterzuentwickeln!