SWR adalah pustaka react hooks untuk pengambilan data.
Nama " SWR " berasal dari stale-while-revalidate , strategi pembatalan cache yang dipopulerkan oleh HTTP RFC 5861. SWR pertama-tama mengembalikan data dari cache (basi), kemudian mengirimkan permintaan (revalidate), dan akhirnya hadir dengan data terbaru lagi.
Dengan hanya satu kait, Anda dapat secara signifikan menyederhanakan logika pengambilan data dalam proyek Anda. Dan itu juga tercakup dalam semua aspek kecepatan, kebenaran, dan stabilitas untuk membantu Anda membangun pengalaman yang lebih baik:
... dan banyak lagi.
Dengan SWR, komponen akan mendapatkan aliran pembaruan data secara konstan dan otomatis . Dengan demikian, UI akan selalu cepat dan reaktif .
Lihat dokumentasi lengkap dan contoh di 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 >
} Dalam contoh ini, react hook useSWR menerima key dan fungsi fetcher . key adalah pengidentifikasi unik dari permintaan, biasanya URL API. Dan fetcher menerima key sebagai parameternya dan mengembalikan data secara tidak sinkron.
useSWR juga Mengembalikan 3 Nilai: data , isLoading dan error . Ketika permintaan (fetcher) belum selesai, data undefined dan isLoading akan true . Ketika kami mendapat respons, ia menetapkan data dan error berdasarkan hasil fetcher , isLoading ke false dan membentuk kembali komponen.
Perhatikan bahwa fetcher dapat berupa fungsi asinkron, Anda dapat menggunakan pustaka pengambilan data favorit Anda untuk menangani bagian itu.
Lihat dokumentasi lengkap dan contoh di swr.vercel.app.
Perpustakaan ini dibuat oleh tim di belakang Next.js, dengan kontribusi dari komunitas kami:
Kontributor
Terima kasih kepada Ryan Chen karena telah memberikan nama paket NPM swr yang luar biasa!
Lisensi MIT.