import React, { Component } from 'react';
import {
AppRegistry,
StyleSheet,
View,
Text,
NetInfo,
Toast
} from 'react-native';
// import NetWorkTool from './src/Net/NetWorkTool';
class Login extends Component {
constructor(props){
super(props);
this.state={
isConnected:null,
connectionInfo:null
}
}
componentDidMount() {
//检测网络是否连接
NetInfo.isConnected.fetch().done((isConnected)=>{
this.setState({isConnected});
});
// 检测网络连接信息
NetInfo.fetch().done((connectionInfo)=>{
this.setState({connectionInfo});
});
// 检测网络变化事件
NetInfo.addEventListener('change',(networkType)=>{
this.setState({isConnected:networkType})
})
}
render() {
return (
<View style={styles.container}>
<Text style={styles.welcome}>
当前的网络状态：
{this.state.isConnected?'网络在线':'离线'}
</Text>
<Text style={styles.welcome}>
当前的网络连接类型：
{this.state.connectionInfo}
</Text>
<Text style={styles.welcome}>
当前连接的网络是否需要计费：
{NetInfo.isConnectionExpensive===true?'需要':'不需要'}
</Text>
</View>
);
}
}
const styles = StyleSheet.create({
container: {
flex: 1,
paddingTop: 30
},
welcome: {
fontSize: 16,
textAlign: 'left',
margin: 10
}
});
React Native NetInfo判断网络状态
最后编辑于 ：
©著作权归作者所有,转载或内容合作请联系作者
- 文/潘晓璐 我一进店门，熙熙楼的掌柜王于贵愁眉苦脸地迎上来，“玉大人，你说我怎么就摊上这事。” “怎么了？”我有些...
- 文/花漫 我一把揭开白布。 她就那样静静地躺着，像睡着了一般。 火红的嫁衣衬着肌肤如雪。 梳的纹丝不乱的头发上，一...
- 文/苍兰香墨 我猛地睁开眼，长吁一口气：“原来是场噩梦啊……” “哼！你这毒妇竟也来了？” 一声冷哼从身侧响起，我...
推荐阅读更多精彩内容
- 适用于双平台网络状态检测 NetInfo.isConnected.fetch().done((isConnecte...
- 类似于Android的TabLayout。亲测有效； 一：react-native-scrollable-tab-...
- React Native中虽然也内置了XMLHttpRequest 网络请求API(也就是俗称的ajax)，但XM...
