2

react-native-web を使用すると、NetInfo は Android と iOS では正常に機能しますが、Web では機能しません。

Web 用に実行されているコードを確認するには、Android I のコンソール ログと同じでcomponentDidMountあり、Android と Web の両方にテキストが表示されます。ただし、イベントは Web バージョンでは機能していないようです。

// src/App.js

import React from 'react';
import { Provider } from 'react-redux';
import store from './utilities/storage/store';
import EntryScreen from './screens/EntryScreen';
import Routing, { Router } from './utilities/routing/index';
import { NetInfo } from 'react-native';

const Route = Routing.Route;

class App extends React.Component {
    componentDidMount() {
        console.log('App mounted');
        NetInfo.isConnected.addEventListener('connectionChange', this.handleConnectivityChange);
    }

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

    /**
     * Listens for any internet connectivity changes.
     * @param isConnected The internet connection status
     */
    handleConnectivityChange = (isConnected) => {
        console.log ('bam');
        console.log ('Connected:', isConnected);
    };

    render() {
        return (
            <Provider store={store}>
                <Router>
                    <Route path="/" component={EntryScreen} />
                </Router>
            </Provider>
        );
    }
}

export default App;

ドキュメンテーションに基づいて、NetInfo は Web だけでなく Android でも機能すると思います。そうでない場合は、誰かがこれを行う方法を提供してください。

"react": "^16.2.0",
"react-art": "^16.2.0",
"react-dom": "^16.2.0",
"react-native": "0.57.8",
"react-native-web": "0.9.13",
4

1 に答える 1