SWR est une bibliothèque React Hooks pour la récupération des données.
Le nom « SWR » est dérivé de stale-while-revalidate , une stratégie d'invalidation du cache popularisée par HTTP RFC 5861. SWR renvoie d'abord les données de Cache (périmées), puis envoie la demande (revalidate), et vient enfin avec les données à jour.
Avec un seul crochet, vous pouvez simplifier considérablement la logique de récupération des données dans votre projet. Et il a également couvert tous les aspects de la vitesse, de l'exactitude et de la stabilité pour vous aider à créer de meilleures expériences:
... et bien plus encore.
Avec SWR, les composants obtiendront un flux de mises à jour de données constamment et automatiquement . Ainsi, l'interface utilisateur sera toujours rapide et réactive .
Afficher la documentation complète et les exemples sur SWR.Vercel.app.
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 >
} Dans cet exemple, le REACT HOW useSWR accepte une key et une fonction fetcher . La key est un identifiant unique de la demande, normalement l'URL de l'API. Et le fetcher accepte key comme son paramètre et renvoie les données de manière asynchrone.
useSWR Renvoie également 3 valeurs: data , isLoading et error . Lorsque la demande (Fetcher) n'est pas encore terminée, data ne seront undefined et isLoading sera true . Lorsque nous obtenons une réponse, il définit data et error en fonction du résultat de fetcher , isLoading en false et remensionne le composant.
Notez que fetcher peut être n'importe quelle fonction asynchrone, vous pouvez utiliser votre bibliothèque préférée et acquise des données pour gérer cette partie.
Afficher la documentation complète et les exemples sur SWR.Vercel.app.
Cette bibliothèque est créée par l'équipe derrière Next.js, avec des contributions de notre communauté:
Contributeurs
Merci à Ryan Chen d'avoir fourni le nom de package swr NPM génial!
La licence MIT.