Vue实战：利用自定义指令实现鼠标拖动元素效果

本篇文章分享一个Vue实战，介绍下使用Vue的自定义指令实现鼠标拖动元素的效果以及解决移动端适配的问题。

前端（vue）入门到精通课程：进入学习

核心属性

• Element.clientWidth：元素可视宽度。
• Element.clientHeight：元素可视高度。
• MouseEvent.clientX：鼠标相对于浏览器左上顶点的水平坐标。
• MouseEvent.clientY：鼠标相对于浏览器左上顶点的垂直坐标。
• Touch.clientX：触点相对于浏览器左上顶点的水平坐标（移动端属性）。
• Touch.clientY：触点相对于浏览器左上顶点的垂直坐标（移动端属性）。
• HTMLElement.offsetLeft：当前元素左上角相对于父节点（HTMLElement.offsetParent）的左边偏移的距离。当元素脱离文档流时（position: fixed）则相对于原点（浏览器左上顶点）偏移。【