Question

我已经使用NetInfo来检查Internet连接。它工作正常，但由于我必须在应用程序打开后立即获取json数据，因此已在componentDidMount或componentWillMount方法中使用了它。发生的情况是，如果开始时没有连接，它将检测到否则没有连接。如何像Facebook和youtube一样使用它？在这些应用程序中，一旦互联网不可用，它就会检测到并显示没有连接，并且当它可用时，它会自动工作。我应该在哪里使用netInfo实现此功能？

componentDidMount() {
    NetInfo.isConnected.fetch().then(isConnected => {
      this.setState({
        isConnected: isConnected
      });
      if (isConnected) {
        fetch(baseUrl)
          .then(response => response.json())
          .then(responseJson => {
            _ _ _ _ __ _ _ _ __ _ _ 
            _ _ _ _ __ _ _ _ __ _ _ 
          })
          .catch(error => {
            console.error(error);
          });
        }
    });
}

Answer 1

您可以尝试使用event listener。附加带有connectionChange事件的处理程序，以便应用程序会知道连接的更改时间。

NetInfo.addEventListener(
  'connectionChange',
  changeHandler
);

在处理程序功能中检测状态并采取相应措施

var changeHandler = (connectionInfo) => {
  // use connectionInfo.type to determine the status
}

看看document。

希望这会有所帮助！

Answer 2

通常应在APP的顶层使用它。就像在App.js中一样，或使用任何根组件。

您可以这样注册一个侦听器：

NetInfo.isConnected.addEventListener(
  'connectionChange',
  this.handleFirstConnectivityChange
);

因此，只要网络状态发生变化，它将调用handleFirstConnectivityChange函数。您可以将函数定义为

handleFirstConnectivityChange = (isConnected) => {
    if(isConnected) {
        //Network status is online
        // Display any toast or message
    } else {
        // Network status is offline
        // Display any toast or message
    }
     console.log(isConnected, 'isConnected');
}

如何正确使用netInfo

2 个答案: