检测用户是否连接到互联网？

Question

我想将用户路由到某个屏幕，以防他没有连接到互联网。

我只是无法检测到他是否已连接。

我试过这段代码，但没有用：

 async componentWillMount()
{
   if (!await NetInfo.isConnected)
   {
      this.props.navigation.navigate('Saved');
   }
}

任何经过测试的解决方案建议？

原文由 27mdmo7sn 发布，翻译遵循 CC BY-SA 4.0 许可协议

Answer 1

试试 await NetInfo.isConnected.fetch()

参考： https ://facebook.github.io/react-native/docs/netinfo.html#isconnected

原文由 Gabriel Bleu 发布，翻译遵循 CC BY-SA 4.0 许可协议

Answer 2

您的情况的另一种解决方案（不使用 isConnected 属性的解决方案）是直接使用从事件处理程序返回的对象，如下所示：

 componentDidMount() {
  NetInfo.addEventListener('connectionChange', this.handleNetworkChange);
}

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

handleNetworkChange = (info) => {
    if (info.type === 'none') {
      this.props.navigation.navigate('Saved');
    }
};

根据 NetInfo 文档：

connectionChange 事件在网络状态改变时触发。事件处理程序的参数是一个带有键的对象：

类型：ConnectionType（上面列出）

effectiveType：一个 EffectiveConnectionType（上面列出）

连接类型可以是以下之一：无、wifi、蜂窝、未知。

理想情况下，您可以将此信息存储到您的 redux 存储中，并将侦听器存储到根组件中。

我们在使用 isConnected 时遇到了一个奇怪的错误，类似于您提到的 @Gabriel Bleu，但对我们来说，NetInfo.isConnected.fetch() 仅在 Android 设备在一段时间不活动后唤醒时才返回 false。我们用它来显示离线警告用户，所以警告从未离开过。我在 Spencer Carli 的课程中找到了这个解决方案，它似乎工作得更好，但根据您的需要，您可能希望将 isConnected 与上述代码结合使用。

原文由 Vely 发布，翻译遵循 CC BY-SA 4.0 许可协议