1.创建hooks文件
import { ref, onMounted, onBeforeUnmount } from "vue";
export default function () {
const x = ref(-1);
const y = ref(-1);
const clickHandler = (event: MouseEvent) => {
x.value = event.pageX;
y.value = event.pageY;
};
onMounted(() => {
window.addEventListener("click", clickHandler);
});
onBeforeUnmount(() => {
window.removeEventListener("click", clickHandler);
});
return {
x,
y
}
}
2.页面使用
import useMousePosition from "../hooks/useMousePosition";
export default defineComponent({
name: "Home",
components: {
Child,
},
setup() {
const {x,y}=useMousePosition()
return {
x,
y
};
}
});