useBattery #

响应式 Battery Status API，更多时候被称之为 Battery API, 提供了有关系统充电级别的信息并提供了通过电池等级或者充电状态的改变提醒用户的事件。这个可以在设备电量低的时候调整应用的资源使用状态，或者在电池用尽前保存应用中的修改以防数据丢失。

Reactive Battery Status API, more often referred to as the Battery API, provides information about the system's battery charge level and lets you be notified by events that are sent when the battery level or charging status change. This can be used to adjust your app's resource usage to reduce battery drain when the battery is low, or to save changes before the battery runs out in order to prevent data loss.

例子 #

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

Usage #

import { useBattery } from '@vueuse/core'

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

import { useBattery } from '@vueuse/core'

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

Use-cases #

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

Our applications normally are not empathetic to battery level, we can make a few adjustments to our applications that will be more friendly to low battery users.

• 触发“暗黑模式”省电主题来省电。
• Trigger a special "dark-mode" battery saver theme settings.
• 停止自动播放视频。
• Stop auto playing videos in news feeds.
• 禁用一些不重要的后台。
• Disable some background workers that are not critical.
• 限制网络调用，降低CPU/内存消耗
• Limit network calls and reduce CPU/Memory consumption.

Component Usage #

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

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

Type Declarations #

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

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

Source #

Source • Demo • Docs

贡献者(Contributors) #

日志(Changelog) #