swr
v2.3.0
SWR ist eine React Hooks -Bibliothek für das Abheben von Daten.
Der Name „ SWR “ wird von stale-while-revalidate abgeleitet, eine von HTTP RFC 5861 populäre Cache-Invalidierungsstrategie.
Mit nur einem Haken können Sie die Datenabruflogik in Ihrem Projekt erheblich vereinfachen. Und es behandelt auch alle Aspekte von Geschwindigkeit, Korrektheit und Stabilität, um Ihnen dabei zu helfen, bessere Erfahrungen aufzubauen:
... und viel mehr.
Bei SWR erhalten Komponenten ständig und automatisch einen Strom von Datenaktualisierungen . Somit wird die Benutzeroberfläche immer schnell und reaktiv sein.
Vollständige Dokumentation und Beispiele auf Swr.vercel.App anzeigen.
import useSWR from 'swr'
function Profile ( ) {
const { data , error , isLoading } = useSWR ( '/api/user' , fetcher )
if ( error ) return < div > failed to load </ div >
if ( isLoading ) return < div > loading... </ div >
return < div > hello { data . name } ! </ div >
} In diesem Beispiel akzeptiert der React Hook useSWR einen key und eine fetcher -Funktion. Der key ist eine eindeutige Kennung der Anfrage, normalerweise die URL der API. Und der fetcher akzeptiert key als Parameter und gibt die Daten asynchron zurück.
useSWR gibt auch 3 Werte zurück: data , isLoading und error . Wenn die Anfrage (Fetcher) noch nicht abgeschlossen ist, werden data undefined und isLoading wird true . Wenn wir eine Antwort erhalten, legt sie data und error basierend auf dem Ergebnis von fetcher fest, isLoading die Komponente in False und renker.
Beachten Sie, dass fetcher eine asynchrone Funktion sein kann. Sie können Ihre bevorzugte Datenfetchbibliothek verwenden, um diesen Teil zu verarbeiten.
Vollständige Dokumentation und Beispiele auf Swr.vercel.App anzeigen.
Diese Bibliothek wird vom Team hinter Next.js mit Beiträgen unserer Community erstellt:
Mitwirkende
Vielen Dank an Ryan Chen für den fantastischen swr NPM -Paketnamen!
Die MIT -Lizenz.
