usePointerLock

类别

Sensors

导出体积

1.48 kB

上次更改

2 months ago

响应式的指针锁定。

示例

源码 playground (beta)

基本用法

import { usePointerLock
 } from '@vueuse/core'

const {
  isSupported
,
  lock
,
  unlock
,
  element
,
  triggerElement

} = usePointerLock
()

组件用法

vue

<template>
  <UsePointerLock v-slot="{ lock
 }">
    <canvas
 />
    <button
 @click
="lock
">
      在画布上锁定指针
    </button
>
  </UsePointerLock>
</template>

类型声明

export interface UsePointerLockOptions extends ConfigurableDocument {}
/**
 * 响应式指针锁
 *
 * @see https://vueuse.org/usePointerLock
 * @param target
 * @param options
 *
 * @__NO_SIDE_EFFECTS__
 */
export declare function usePointerLock
(
  target
?: MaybeElementRef
,
  options
?: UsePointerLockOptions,
): {
  isSupported
: ComputedRef
<boolean>
  element
: ShallowRef
<MaybeElement
, MaybeElement
>
  triggerElement
: ShallowRef
<MaybeElement
, MaybeElement
>
  lock
: (e
: MaybeElementRef
 | Event) => Promise
<HTMLElement | SVGElement>
  unlock
: () => Promise
<boolean>
}
export type UsePointerLockReturn
 = ReturnType
<typeof usePointerLock
>