React 19-da 'use' Hook-u və Asinxron Məlumat Oxunması

React-in tarixində ilk dəfə olaraq 'use' adlı xüsusi bir primitiv təqdim edildi. Ənənəvi hook-lar ('useState', 'useEffect', 'useContext') React-in məşhur "Hook Qaydaları"na tabedir: onlar heç vaxt dövrlərin ('for', 'while') və ya şərtlərin ('if') daxilində çağırıla bilməz. Lakin 'use' bu qaydaların sərhədlərini aşır. O, texniki olaraq bir hook-dan daha çox operator kimi işləyir və şərt daxilində çağırıla bilir! 📌 1. 'use' ilə Promislərin Oxunması Təsəvvür edin ki, komponentinizə bir Promise ötürülüb. Əvvəllər bu Promise-i həll etmək üçün 'useEffect' açıb daxilində '.then()' yazmalı, nəticəni 'useState'-ə qoymalı idiniz. İndi isə bu cəmi bir sətirə enir: const data = use(fetchDataPromise); Əgər Promise hələ tamamlanmayıbsa, React komponenti dondurur və ən yaxın <Suspense fallback={<Loading />}> sərhədini ekranda göstərir. Promise uğurla bitən kimi komponent məlumatla birgə render olunur. 📌 2. Şərtli Context Oxunması Köhnə 'useContext(ThemeContext)' mütləq komponentin ən yuxarısında çağırılmalı idi. Əgər siz müəyyən bir şərt ödənəndə konteksti oxumaq istəyirdinizsə, bunu edə bilmirdiniz. 'use' ilə artıq mümkündür: if (isLoggedIn) { const theme = use(ThemeContext); } 📌 3. Praktiki Məsləhətlər - 'use(Promise)' çağırışında hər render zamanı yeni Promise yaratmaqdan çəkinin, çünki bu sonsuz dövrə səbəb ola bilər. Promise ya Server Component-dən prop kimi gəlməli, ya da keşlənməlidir. - React 19 ilə layihələrinizdə 'use' tətbiq etmək kodun həcmini 40%-ə qədər azaldır və oxunaqlılığı artırır.