تكرار السؤال: …
الإجابة المختصرة
باستخدام خطاف useNetInfo أو دالة addEventListener للاستماع المستمر لتغير نوع الاتصال (WiFi, Cellular, None) ومعرفة هل الإنترنت متاح فعلياً (isInternetReachable).
الشرح
يوفر NetInfo معلومات تفصيلية عن حالة الشبكة. يجب الانتباه للفارق بين isConnected (الجهاز متصل بمودم أو برج اتصالات) و isInternetReachable (هل يمكن للجهاز الوصول فعلياً إلى الإنترنت وتجاوز بوابات التحقق Captive Portals).
مثال بالكود
import { useNetInfo } from '@react-native-community/netinfo';
import { View, Text } from 'react-native';
function NetworkBanner() {
const netInfo = useNetInfo();
if (netInfo.isConnected === false || netInfo.isInternetReachable === false) {
return (
<View style={{ backgroundColor: '#b00020', padding: 8 }}>
<Text style={{ color: '#fff', textAlign: 'center' }}>لا يوجد اتصال بالإنترنت</Text>
</View>
);
}
return null;
}أخطاء شائعة
- الاعتماد على isConnected فقط، بينما قد يكون الهاتف متصلاً بشبكة WiFi تتطلب تسجيل دخول ولا تمرر أي بيانات فعلية.