useDeviceMotion

类别

Sensors

导出大小

1.14 kB

最近修改

7 months ago

响应式 DeviceMotionEvent。为网页开发者提供关于设备位置和方向变化速度的信息。

🌐 Reactive DeviceMotionEvent. Provide web developers with information about the speed of changes for the device's position and orientation.

示例

源代码在线运行

Device Motion:

Not supported by your current browser.

用法

🌐 Usage

import { useDeviceMotion } from '@vueuse/core'

const {
  acceleration,
  accelerationIncludingGravity,
  rotationRate,
  interval,
} = useDeviceMotion()

注意：对于 iOS，你需要使用 trigger 并将其与用户交互绑定。 授权后，API 将自动运行

状态	类型	描述
acceleration	object	一个对象，提供设备在 X、Y 和 Z 三个轴上的加速度。
accelerationIncludingGravity	object	一个对象，提供设备在 X、Y 和 Z 三个轴上的加速度，包括重力的影响。
rotationRate	object	一个对象，提供设备在三个姿态轴 alpha、beta 和 gamma 上的方向变化速率。
interval	Number	一个数字，表示从设备获取数据的时间间隔，单位为毫秒。
ensurePermissions	boolean	表示平台是否需要权限来使用该 API
permissionGranted	boolean	表示用户是否已授予权限，默认值始终为 false
trigger	Promise<void>	一个异步函数，用于请求用户权限。一旦权限被授予，API 会自动运行

你可以在 MDN 上找到有关该状态的更多信息。

🌐 You can find more information about the state on the MDN.

组件用法

🌐 Component Usage

<template>
  <UseDeviceMotion v-slot="{ acceleration }">
    Acceleration: {{ acceleration }}
  </UseDeviceMotion>
</template>