如何在 React Native iOS 中查看网络信息？答案

【问题标题】：How to check net Info in React Native iOS?如何在 React Native iOS 中查看网络信息？
【发布时间】：2017-08-29 03:59:56
【问题描述】：

我需要在 react native iOS 中检查互联网连接

我会尝试以下代码：

NetInfo.isConnected.fetch().then(isConnected => {
   console.log(isConnected);
});

可以在 react native android 应用程序中正常工作，但它总是在反应原生 iOS 中返回 'false' 。

【问题讨论】：

标签： javascript react-native react-native-ios

【解决方案1】：

react native's github 目前有一个未解决的问题。

您可以在那里看到讨论，但简而言之 - fetch 总是返回 false，但您可以通过收听连接更改事件来解决它。

那里的代码示例：

componentDidMount() {
    NetInfo.isConnected.addEventListener('change', this.handleConnectionChange);

    NetInfo.isConnected.fetch().done(
      (isConnected) => { this.setState({ status: isConnected }); }
    );
}

componentWillUnmount() {
    NetInfo.isConnected.removeEventListener('change', this.handleConnectionChange);
}

handleConnectionChange = (isConnected) => {
        this.setState({ status: isConnected });
        console.log(`is connected: ${this.state.status}`);
}

编辑：

好像这个问题是worked on。此外，change 事件已重命名为 connectionChange。更新的解决方法代码：

componentDidMount() {
    NetInfo.isConnected.addEventListener('connectionChange', this.handleConnectionChange);

    NetInfo.isConnected.fetch().done(
      (isConnected) => { this.setState({ status: isConnected }); }
    );
}

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

handleConnectionChange = (isConnected) => {
        this.setState({ status: isConnected });
        console.log(`is connected: ${this.state.status}`);
}

更新：

change 事件类型已弃用。考虑使用connectionChange 事件类型。

【讨论】：

这可能已经很晚了。但是.....NetInfo 的“更改”事件已被弃用。改为收听“connectionChange”事件。
如果在卸载组件后解决了 isConnected.fetch 承诺，则此方法会导致警告，因为在卸载组件上调用 setState

【解决方案2】：

通过使用this 模块，您可以订阅网络状态更新

const unsubscribe = NetInfo.addEventListener(state => {
  console.log("Is connected?", state.isConnected);
});

您还可以查看当前活动的网络连接是否可以访问互联网。

console.log("Is Internet Reachable?", state.isInternetReachable);

我还用源代码解释了 react-native-netinfo 的用法及其功能here。

【讨论】：