Skip to content

usePointerLock

类别
导出体积
1.44 kB
上次更改
2 months ago

响应式的指针锁定

示例

基本用法

ts
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>

类型声明

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

源码

源码演示文档

贡献者

一纸忘忧
Anthony Fu
Vida Xie
IlyaL
SerKo
IlyaL
Robin
Fernando Fernández
Robin
Anthony Fu
Sergey Danilchenko

更新日志

8c521 - feat(components)!: refactor components and make them consistent (#4912)
d32f8 - refactor: add @__NO_SIDE_EFFECTS__ annotations to all pure functions (#4907)
ce9e5 - fix(useMouse): check for MouseEvent instead of Touch to work with FF (#4457)
dd316 - feat: use passive event handlers everywhere is possible (#4477)
0a9ed - feat!: drop Vue 2 support, optimize bundles and clean up (#4349)
a086e - fix: stricter types