NetInfo
- React Native kursu
- İleri seviye
- Ders 31/83
- 5 dk
NetInfo ile ağ durumu öğrenirsin.
NetInfo paketi
Uygulamanın çevrimiçi mi yoksa çevrimdışı mı olduğunu öğrenmek için @react-native-community/netinfo paketini kullanırsın. Bu paket, ağ durumunu anlık olarak verir; isConnected alanı cihazın internete bağlı olup olmadığını söyler. Expo ile kurulum: npx expo install @react-native-community/netinfo.
Paket iki şekilde kullanılır. Birincisi anlık sorgu: const state = await NetInfo.fetch(); bu, o anki ağ durumunu verir. İkincisi abonelik: NetInfo.addEventListener((state) => ...); bu, ağ durumu her değiştiğinde çağrılır. Abonelik bir işlev döndürür; bu işlev çağrılınca abonelik kaldırılır. Çevrimdışı uygulamalarda ağ durumunu bilmek kritiktir.
İçe aktarma ve fetch
Paket varsayılan dışa aktarım olarak gelir: import NetInfo from '@react-native-community/netinfo'. Anlık sorgu için await NetInfo.fetch() kullanırsın. Sonuç bir nesnedir; isConnected alanı bağlantı durumunu, type alanı ağ türünü (wifi, cellilar) taşır.
Örnek: const state = await NetInfo.fetch(); console.log(state.isConnected). Bu, o anki bağlantıyı konsola yazar. state.isConnected true ise cihaz çevrimiçi, false ise çevrimdışıdır. Bu bilgiye göre uygulama, ağ isteği yapabilir veya yerel önbelleğe düşer.
Uygulama Ağ durumunu sorgula
Boş checkOnline işlevini tamamla. const state = await NetInfo.fetch() çağır. return state.isConnected ile bağlantı durumunu döndür.
Başlangıç kodu
import NetInfo from '@react-native-community/netinfo';
export async function checkOnline() {
// ağ durumunu sorgula ve isConnected döndür
}Örnek çözüm
const state = await NetInfo.fetch();
return state.isConnected;Soru ve cevaplar
Dersin sorularını cevaplarıyla birlikte inceleyebilirsin. Kendini denemek istersen dersi interaktif olarak çöz.
1 NetInfo ne sağlar?
- Yalnızca dosya saklama
- Ağ durumu bilgisi Doğru cevap
- Yalnızca kamera
- Yalnızca konum
Açıklama: NetInfo ağ durumu bilgisi sağlar.
2 İçe aktarma cümlesini yaz
import ____ from '@react-native-community/netinfo';import NetInfo from '@react-native-community/netinfo';Açıklama: NetInfo varsayılan dışa aktarımdır.
3 Parçayı rolüne eşle
| Kavram | Anlamı |
|---|---|
NetInfo.fetch() |
Anlık sorgu |
addEventListener |
Abonelik kurar |
isConnected |
Bağlantı durumu |
type |
Ağ türü |