useDeviceOrientation

类别

Sensors

导出大小

753 B

最近修改

2 days ago

响应式 DeviceOrientationEvent。为网页开发者提供运行网页的设备的物理方向信息。

🌐 Reactive DeviceOrientationEvent. Provide web developers with information from the physical orientation of the device running the web page.

示例

源代码在线运行

isSupported: false
isAbsolute: false
alpha: null
beta: null
gamma: null

用法

🌐 Usage

import { useDeviceOrientation } from '@vueuse/core'

const {
  isAbsolute,
  alpha,
  beta,
  gamma,
} = useDeviceOrientation()

状态	类型	描述
isAbsolute	boolean	一个布尔值，表示设备是否提供绝对方向数据。
alpha	number	一个数字，表示设备围绕 z 轴的运动，以度为单位，取值范围为 0 到 360。
beta	number	一个数字，表示设备围绕 x 轴的运动，以度为单位，取值范围为 -180 到 180。
gamma	number	一个数字，表示设备围绕 y 轴的运动，以度为单位，取值范围为 -90 到 90。

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

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

组件用法

🌐 Component Usage

<template>
  <UseDeviceOrientation v-slot="{ alpha, beta, gamma }">
    Alpha: {{ alpha }}
    Beta: {{ beta }}
    Gamma: {{ gamma }}
  </UseDeviceOrientation>
</template>