Vue3中获取鼠标在浏览器x轴和y轴的位置
Vue3中获取鼠标在浏览器x轴和y轴的位置详解
·
在日常开发和工作中我们经常遇到需要获取鼠标指向的当前位置,很多人感觉很难并不好理解,但是看文本文我相信你会对这个知识有更深层的认识。
使用onMounted定义document.addEventListener,第一个参数是鼠标指向类型,也可以单击 click、mousedown,第二个参数是事件函数。另外最后一个参数决定该事件的响应顺序;
① 如果为true事件执行顺序为 addEventListener---标签的onclick事件---document.onclick。
② 如果为false事件的顺序为 标签的onclick事件---document.onclick---addEventListener
一、第一种
此时我们的事件函数里可以在控制台打印出来当前信息。将它赋值给我们定义的变量即可。
二、第二种。使用reactive,方便前期书写和后期维护。
三、第三种。使用封装
① assets目录下新建js文件,把获取x、y轴封装起来。在使用的页面直接引入即可调用。
更多推荐
已为社区贡献3条内容
所有评论(0)