Heim > Web-Frontend > js-Tutorial > Unterstützt React den Abruf?

Unterstützt React den Abruf?

藏色散人
Freigeben: 2020-12-15 09:55:53
Original
1723 Leute haben es durchsucht

fetch wird in React unterstützt, da Fetch XMLHttpRequest in ReactJS entspricht. Es bietet viele der gleichen Funktionen wie XMLHttpRequest, ist jedoch skalierbarer und effizienter.

Unterstützt React den Abruf?

Empfohlen: „React Video Tutorial“ und Effizienz.

Der Kern von Fetch liegt in der Abstraktion der HTTP-Schnittstelle, einschließlich Anforderung, Antwort, Header, Text und globalem Abruf zur Initialisierung asynchroner Anforderungen. Dank dieser durch JavaScript implementierten abstrakten HTTP-Module können andere Schnittstellen diese Funktionen problemlos nutzen. Darüber hinaus nutzt Fetch auch die asynchrone Natur der Anfrage – es basiert auf Promise. Wie wende ich Fetch in einem Reaktionsprojekt an?

Schritt 1: Installieren

Wenn Sie npm zur Installation verwenden, führen Sie zur Installation cnpm install whatwg-fetch --save aus.

Schritt 2: Anwendung in konkreten Projekten.

Die Ersten nutzen.

Unterstützt React den Abruf?Stellen Sie zunächst die abhängigen Plug-Ins vor, siehe ./app/fetch/test.js

Anschließend können Sie eine Get-Anfrage initiieren.

Schauen Sie sich zunächst den Inhalt unserer ./app/index.jsx-Datei an. Es muss auf getData verwiesen werden. Der Abruf hier ist eine Methode, die nach dem Zitieren des Plug-Ins verwendet werden kann verwenden. Der erste Parameter der Methode ist die URL und der zweite Parameter sind Konfigurationsinformationen. Die

Unterstützt React den Abruf?fetch-Methode fordert Daten an und gibt ein Promise-Objekt zurück.

In der Konfiguration des obigen Codes bedeuten Anmeldeinformationen: „include“, dass domänenübergreifende Anforderungen Cookies mitbringen können (domänenübergreifende Abrufanforderungen bringen standardmäßig keine Cookies mit, und Sie müssen

Unterstützt React den Abruf?Anmeldeinformationen manuell angeben: „include“ (bei Bedarf) (wie XHRs withCredentials) können Header die Header-Informationen von http-Anfragen festlegen.

Die zweite Art der Post-Nutzung

kann auf die gleiche Weise auf das Plug-in gemäß der Get-Request-Methode verweisen. In unserer ./app/index.jsx müssen wir

Unterstützt React den Abruf?

zitieren und dann fetch verwenden Um eine Post-Anfrage zu initiieren (Es gibt die Methode „POST“), ist der erste Parameter die URL und der zweite Parameter die Konfigurationsinformationen. Achten Sie auf das Format der Header und des

Body in den Konfigurationsinformationen unten. Nachdem fetch die Daten übermittelt hat, ist das zurückgegebene Ergebnis ebenfalls ein Promise-Objekt, genau wie die get-Methode.

In den beiden oben genannten Verwendungen sind die zurückgegebenen Promis-Objekte unterschiedlich, eines ist res.text() und das andere ist res.json(). Diese beiden Methoden dienen dazu, die zurückgegebenen Antwortdaten in das

Unterstützt React den Abruf?-String- oder JSON-Format zu konvertieren. Dies sind auch zwei in js häufig verwendete Formate.

Das nächste, was wir tun müssen, ist tatsächlich eine Rationalisierungsaufgabe. Wenn Sie jedes Mal, wenn Sie Daten abrufen, viel Code wie oben schreiben, wäre dies zu überflüssig. Hier abstrahieren wir die Get- und Post-Methoden separat.

Nachdem wir diese beiden Methoden abstrahiert haben, wird es für uns ganz einfach, sie wieder zu verwenden.

Schritt 1: Extrahieren Sie den öffentlichen Teil.Unterstützt React den Abruf?

getjs-Teil

Dann einfach Führen Sie das Projekt aus.

Das obige ist der detaillierte Inhalt vonUnterstützt React den Abruf?. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!

Verwandte Etiketten:
Quelle:php.cn
Erklärung dieser Website
Der Inhalt dieses Artikels wird freiwillig von Internetnutzern beigesteuert und das Urheberrecht liegt beim ursprünglichen Autor. Diese Website übernimmt keine entsprechende rechtliche Verantwortung. Wenn Sie Inhalte finden, bei denen der Verdacht eines Plagiats oder einer Rechtsverletzung besteht, wenden Sie sich bitte an admin@php.cn
Beliebte Tutorials
Mehr>
Neueste Downloads
Mehr>
Web-Effekte
Quellcode der Website
Website-Materialien
Frontend-Vorlage