swr
v2.3.0
SWR هي مكتبة React Hooks لجلب البيانات.
تم اشتقاق اسم " SWR " من stale-while-revalidate التي تم تعميمها بواسطة HTTP RFC 5861. SWR إرجاع البيانات أولاً من ذاكرة التخزين المؤقت (Stale) ، ثم ترسل الطلب (إعادة صياغة) ، وأخيراً تأتي مع بيانات محدثة مرة أخرى.
باستخدام خطاف واحد فقط ، يمكنك تبسيط منطق جلب البيانات بشكل كبير في مشروعك. كما أنه مغطى بجميع جوانب السرعة والصحة والاستقرار لمساعدتك في بناء تجارب أفضل:
... وأكثر من ذلك بكثير.
مع SWR ، ستحصل المكونات على دفق من تحديثات البيانات باستمرار وتلقائي . وبالتالي ، فإن واجهة المستخدم ستكون دائمًا سريعة وتفاعلية .
عرض الوثائق والأمثلة الكاملة على 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 >
} في هذا المثال ، يقبل Hook Hook useSWR key ودالة fetcher . key هو معرف فريد للطلب ، وعادة ما يكون عنوان URL في واجهة برمجة التطبيقات. ويقبل fetcher key كمعلمة له ويعيد البيانات بشكل غير متزامن.
يستخدم useSWR أيضًا 3 قيم: data ، isLoading error . عند عدم الانتهاء من الطلب (Fetcher) ، لن يتم undefined data وسوف تكون isLoading true . عندما نحصل على استجابة ، فإنه يعين data error بناءً على نتيجة fetcher ، isLoading إلى False و Rerenders المكون.
لاحظ أن fetcher يمكن أن يكون أي وظيفة غير متزامنة ، يمكنك استخدام مكتبة إحصاء البيانات المفضلة لديك للتعامل مع هذا الجزء.
عرض الوثائق والأمثلة الكاملة على swr.vercel.app.
تم إنشاء هذه المكتبة من قبل الفريق وراء Next.js ، مع مساهمات من مجتمعنا:
المساهمين
بفضل Ryan Chen لتوفير اسم حزمة swr NPM رائع!
ترخيص معهد ماساتشوستس للتكنولوجيا.
