Documentation

Getting Started

Hooks Overview

useFetch( )useCopyToClipboard( )useNetwork( )useFullScreen( )useGeolocation( )useSelectedText( )useStateCallback( )useResize( )useSearch( )useImageDownload( )

useNetwork( )

A React Hook that gets the users network information and which provides information about the connection a device is using to communicate with the network and provides a means for scripts to be notified if the connection type changes

Usage

1import { useNetwork } from 'react-modern-hooks'
2
3const Demo = () => {
4  const { connection } = useNetwork()
5
6  connection.onchange = (e) => {
7    // Handle change of connection type here.
8  }
9
10  return (
11    <div>
12      <h1>Network Info</h1>
13      <p>Downlink: {connection.downlink} </p>
14      <p>Downlink Max: {connection.downlinkMax}</p>
15      <p>Round trip time: {connection.rtt}</p>
16      <p>
17        Has user set a reduced data usage option on the user agent:{' '}
18        {connection.saveData}
19      </p>
20      <p>Connection Type: {connection.type}</p>
21    </div>
22  )
23}
24
25export default Demo

Documentation

Getting Started

Hooks Overview

useNetwork( )

Usage

References

Input Variables

Output Variables