useBattery

响应式电池状态 API（更常被称为电池 API）提供了有关系统电池电量的信息，并允许您通过在电池电量或充电状态改变时发送的事件接收通知。这可用于在电池电量低时调整应用程序的资源使用以减少电池消耗，或在电池耗尽前保存更改以防止数据丢失。

Demo

使用

import { useBattery } from '@vueuse/core'

const { charging, chargingTime, dischargingTime, level } = useBattery()

状态	类型	描述
`charging`	`Boolean`	设备当前是否正在充电。
`chargingTime`	`Number`	设备充满电所需的秒数。
`dischargingTime`	`Number`	设备完全放电所需的秒数。
`level`	`Number`	表示当前电量水平的数字，介于 0 到 1 之间。

用例

我们的应用程序通常对电池电量不敏感。我们可以对应用程序进行一些调整，使其对低电量用户更加友好：

触发特殊的 “深色模式” 电池 节电主题设置。
停止新闻推送中 视频的自动播放。
禁用一些不重要的后台工作。
限制网络调用并减少 CPU/内存消耗。

组件方式使用

此函数也通过 @vueuse/components 包提供一个无渲染组件版本。了解更多用法。

<template>
  <UseBattery v-slot="{ charging }">
    Is Charging: {{ charging }}
  </UseBattery>
</template>

类型声明

export interface BatteryManager extends EventTarget {
  charging: boolean
  chargingTime: number
  dischargingTime: number
  level: number
}
/**
 * Reactive Battery Status API.
 *
 * @see https://vueuse.org/useBattery
 */
export declare function useBattery(options?: ConfigurableNavigator): {
  isSupported: ComputedRef<boolean>
  charging: ShallowRef<boolean, boolean>
  chargingTime: ShallowRef<number, number>
  dischargingTime: ShallowRef<number, number>
  level: ShallowRef<number, number>
}
export type UseBatteryReturn = ReturnType<typeof useBattery>

onStartTyping

useDeviceMotion