Vue3中获取鼠标在浏览器x轴和y轴的位置

在日常开发和工作中我们经常遇到需要获取鼠标指向的当前位置，很多人感觉很难并不好理解，但是看文本文我相信你会对这个知识有更深层的认识。

使用onMounted定义document.addEventListener，第一个参数是鼠标指向类型，也可以单击 click、mousedown，第二个参数是事件函数。另外最后一个参数决定该事件的响应顺序；

① 如果为true事件执行顺序为 addEventListener---标签的onclick事件---document.onclick。

② 如果为false事件的顺序为 标签的onclick事件---document.onclick---addEventListener

一、第一种

此时我们的事件函数里可以在控制台打印出来当前信息。将它赋值给我们定义的变量即可。

二、第二种。使用reactive，方便前期书写和后期维护。

三、第三种。使用封装

① assets目录下新建js文件，把获取x、y轴封装起来。在使用的页面直接引入即可调用。