反應與NetINFO本機檢查互聯網連接

我實施檢查互聯網上我的react-native v0.49應用程序。我正在使用反應原生的NetInfo。我添加eventListener時發生任何變化，它會調用函數。但是當我在模擬器和真實設備中測試它時，我只得到第一個改變，但是如果我從Wifi斷開連接，我沒有看到任何改變。反應與NetINFO本機檢查互聯網連接

internetConnectionPopUp

import React, { Component } from 'react'; 
import { 
    View, 
    Text, 
    NetInfo 
} from 'react-native'; 

// styles 
import { style } from './style'; 
import { globalStyle } from '../../assets/styles/globalStyle'; 

// redux 
import {connect} from 'react-redux'; 
import * as actions from '../../actions'; 

class InternetConnectionPopUp extends Component { 
    constructor(props){ 
     super(props); 
     this.state = { 
      connectionInfo : '' 

     } 
     this.handleFirstConnectivityChange = this.handleFirstConnectivityChange.bind(this); 

    } 
    handleFirstConnectivityChange(connectionInfo) { 
     this.setState({ 
      connectionInfo: connectionInfo.type 
     }) 
     console.log('First change, type: ' + connectionInfo.type + ', effectiveType: ' + connectionInfo.effectiveType); 

     } 

    componentWillMount() { 
     NetInfo.getConnectionInfo().then((connectionInfo) => { 
      this.setState({ 
       connectionInfo: connectionInfo.type 
      }) 
      //console.log('Initial, type: ' + connectionInfo.type + ', effectiveType: ' + connectionInfo.effectiveType); 
      }); 

      NetInfo.addEventListener(
      'connectionChange', 
      this.handleFirstConnectivityChange 
     ); 
    } 
    componentWillUnmount() { 
     NetInfo.removeEventListener(
      'connectionChange', 
      handleFirstConnectivityChange 
     ); 
    } 




    render() { 


     return (
      <View> 
       <Text> ComponentName component </Text> 
       <Text> { this.state.connectionInfo } </Text> 
      </View>  
     ); 
    } 
} 


export default InternetConnectionPopUp;

來源

2017-10-19 Adir Zoari

我可以重現你的錯誤，它爲我的作品改變componentWillMount到componentDidMount。我認爲React有一個內部錯誤，調用this.setState，因爲組件尚未安裝（所以它可以重新渲染任何東西）。

希望它有幫助:)

來源

2017-10-19 15:31:16

謝謝，它解決了我的錯誤。 –

反應與NetINFO本機檢查互聯網連接

回答

相關問題