Network Status
The Network Information is a Web API that provides useful information about the device's connection. To quote from the MDN:
containing information about the system's connection, such as the current bandwidth of the user's device or whether the connection is metered. This could be used to select high definition content or low definition content based on the user's connection.
Usage
You can use the useNetworkStatus
function to gain access to the network information:
import { useNetworkStatus } from 'vue-adaptive-utils';
export default {
setup() {
const info = useNetworkStatus();
}
};
The useNetworkStatus
returns the following properties and methods:
TIP
The Ref Type column represents the underlying exposed type of the refs. All the exposed Refs are read-only.
Prop | Ref Type | Fallback Value | Description |
---|---|---|---|
isOnline | boolean | true | Wether the device is currently connected or not. |
saveData | boolean | false | Wether the device has the "save data" option enabled or not. |
offlineAt | number | undefined | A timestamp when the user was last disconnected. |
downlink | number | undefined | The average download speed of the connection in megabits per second. |
downlinkMax | number | undefined | The maximum download speed of the connection in megabits per second. |
effectiveConnectionType | 'slow-2g' | '2g' | '3g' | '4g' | undefined | undefined | Effective type of the connection. |
networkType | 'bluetooth' | 'cellular' | 'ethernet' | 'none' | 'wifi' | 'wimax' | 'other' | 'unknown' | undefined | type of connection a device is using to communicate with the network. |
isSupported | boolean | false | If the API is supported on this device. |