React component that notifies when browser is either offline or online.
npm install react-offlinereact-offline
=============
> React component that notifies when browser is either offline or online.
``sh`
yarn add react-offlineor
npm install react-offline
`js
// 3rd-party imports
import ReactDOM from "react-dom";
import React, { Component } from "react";
import Offline from "react-offline";
// function as child component
ReactDOM.render(
console.log({ isOffline, isOnline })}
>
{({ isOffline, isOnline }) => {
return isOffline ?
// render prop
ReactDOM.render(
console.log({ isOffline, isOnline })}
render={({ isOffline, isOnline }) => {
return isOffline ?
Props
$3
An optional function that is called whenever the browser's network connectivity has changed (e.g. switching between online and offline).
The
function is invoked with an object argument: ({ isOffline, isOnline }). It's expected that
render function returns a single React element.
This has same API semantics as React.Component.render().If
render function is given, it has precedence over any given child component:`js
return (
"I take precedence over any function as child component."
);
}}
>
{() => {
return "I will not render.";
}}
`
$3
Same as
prop function (see above).If
render function is not given, then the child component will be invoked as a function.The child component function is invoked with an object argument:
({ isOffline, isOnline }).`js
{({ isOffline, isOnline }) => {
return isOffline ? {'I am offline'} : {'I am online'};
}}
``$3
An optional function that is called whenever the browser's network connectivity has changed (e.g. switching between online and offline).
The
function is invoked with an object argument: ({ isOffline, isOnline })`.License
=======
MIT.