usePointer

usePointer

リアクティブなポインターステート

基本的な使い方

import { usePointer } from '@vueuse/core'

const { x, y, pressure, pointerType } = usePointer()

コンポーネントでの使用

デフォルトでは、コンポーネントはwindow上のポインターを追跡します。

<template>
  <UsePointer v-slot="{ x, y }">
    x: {{ x }}
    y: {{ y }}
  </UsePointer>
</template>

要素内のローカル位置を追跡するには、target="self"を設定します。

<template>
  <UsePointer v-slot="{ x, y }" target="self">
    x: {{ x }} y: {{ y }}
  </UsePointer>
</template>