Usebatterystate

useBatteryState

The useBatteryState hook allows you to effortlessly monitor and access battery-related information in your React application.

Installation

  npx hooks-boost install

Usage

import useBattery from "./useBattery";
 
function BatteryComponent() {
  const { charging, chargingTime, dischargingTime, level, loading } = useBattery();
 
  // Access batteryState properties such as batteryState.level, batteryState.charging, etc.
 
  return (
    <div>
      <p>Battery Level: {level}</p>
      <p>Charging: {charging ? "Yes" : "No"}</p>
    </div>
  );
}

Parameters

None

Returns

PropertyTypeDescription
chargingbooleanIndicates whether the battery is currently charging.
chargingTime'Infinity' or numberThe estimated time until the battery is fully charged.
dischargingTime'Infinity' or numberThe estimated time until the battery is fully discharged.
levelnumberThe current battery level as a percentage.
loadingbooleanIndicates whether the battery information is still loading.

Demo

See The Demo (opens in a new tab)