Skip to content

useVibrate

反应式 振动 API

¥Reactive Vibration API

大多数现代移动设备都包含振动硬件,它允许软件代码通过使设备振动来向用户提供物理反馈。

¥Most modern mobile devices include vibration hardware, which lets software code provides physical feedback to the user by causing the device to shake.

振动 API 为 Web 应用提供了访问此硬件(如果存在)的能力,如果设备不支持它,则不执行任何操作。

¥The Vibration API offers Web apps the ability to access this hardware, if it exists, and does nothing if the device doesn't support it.

用法

¥Usage

振动被描述为一种开关脉冲模式,其长度可能不同。

¥Vibration is described as a pattern of on-off pulses, which may be of varying lengths.

该模式可以由描述振动毫秒数的单个整数组成,也可以由描述振动和暂停模式的整数数组组成。

¥The pattern may consist of either a single integer describing the number of milliseconds to vibrate, or an array of integers describing a pattern of vibrations and pauses.

ts
import { useVibrate } from '@vueuse/core'

// This vibrates the device for 300 ms
// then pauses for 100 ms before vibrating the device again for another 300 ms:
const { vibrate, stop, isSupported } = useVibrate({ pattern: [300, 100, 300] })

// Start the vibration, it will automatically stop when the pattern is complete:
vibrate()

// But if you want to stop it, you can:
stop()

类型声明

显示类型声明
typescript
export interface UseVibrateOptions extends ConfigurableNavigator {
  /**
   *
   * Vibration Pattern
   *
   * An array of values describes alternating periods in which the
   * device is vibrating and not vibrating. Each value in the array
   * is converted to an integer, then interpreted alternately as
   * the number of milliseconds the device should vibrate and the
   * number of milliseconds it should not be vibrating
   *
   * @default []
   *
   */
  pattern?: MaybeRefOrGetter<number[] | number>
  /**
   * Interval to run a persistent vibration, in ms
   *
   * Pass `0` to disable
   *
   * @default 0
   *
   */
  interval?: number
}
/**
 * Reactive vibrate
 *
 * @see https://vueuse.org/useVibrate
 * @see https://developer.mozilla.org/en-US/docs/Web/API/Vibration_API
 * @param options
 */
export declare function useVibrate(options?: UseVibrateOptions): {
  isSupported: ComputedRef<boolean>
  pattern: MaybeRefOrGetter<number | number[]>
  intervalControls: Pausable | undefined
  vibrate: (pattern?: number | number[]) => void
  stop: () => void
}
export type UseVibrateReturn = ReturnType<typeof useVibrate>

源代码

源代码文档

变更日志

No recent changes

VueUse 中文网 - 粤ICP备13048890号