useBattery

分类

导出大小

869 B

上次更改

3 个月前

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

演示

源代码演练场（测试版）

isSupported: false
charging: false
chargingTime: 0
dischargingTime: 0
level: 1

用法

import { useBattery
 } from '@vueuse/core'

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

状态	类型	描述
charging	`布尔值`	设备当前是否正在充电。
chargingTime	`数字`	设备完全充满电所需的时间（秒）。
dischargingTime	`数字`	设备完全放电所需的时间（秒）。
level	`数字`	一个介于 0 和 1 之间的数字，表示当前电量水平。

用例

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

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

组件用法

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

vue

<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.cn/useBattery
 *
 * @__NO_SIDE_EFFECTS__
 */
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
>