25 - 鼠标坐标

[kalu5]

// 你的答案
<script setup lang="ts">
import { ref, onMounted, onUnmounted } from 'vue'
// Implement ...
function useEventListener(target, event, callback) {
  onMounted(() => {
    target.addEventListener(event, callback, false)
  })
  
  onUnmounted(() => {
    target.removeEventListener(event, callback, false)
  })
}

// Implement ...
function useMouse() {
  let x = ref<number>(0)
  let y = ref<number>(0)
  useEventListener(window, "mousemove", (e: MouseEvent) => {
    x.value = e.clientX
    y.value = e.clientY
  })
  
  return {
    x, y
  }
}
const { x, y } = useMouse()
</script>

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

[undefined-zzk]

there is no need to annotate the type