Skip to content

25 - 鼠标坐标 #2275

@nsnans

Description

@nsnans
<script setup lang="ts">
import { reactive, ref } from 'vue';


// Implement ...
function useEventListener(target, event, callback) {
  target.addEventListener(event, callback)
}

// Implement ...
function useMouse() {
  const x = ref(0);
  const y = ref(0);
  useEventListener(window, "mousemove", (e) => {
    x.value = e.clientX;
    y.value = e.clientY;
  })

  return { x, y }
}
const { x, y } = useMouse()
</script>

<template>
  Mouse position is at: {{ x }}, {{ y }}
</template>

Metadata

Metadata

Assignees

No one assigned

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions