今天用vue+原生js的mousemove事件，写了个拖动，发现只能慢慢拖动才行，鼠标只要移动快了，就失效，不能拖动了；
搞了半天在，总算解决了，但是问题的深层原理还没搞清楚，知道的大侠可以留言分享，下面直接上代码：
只能慢速拖动的代码：
vue结合原生js实现拖动
{{ site.name }}
{{ index }} : {{ site.name }}
可以快速拖动的代码：
vue结合原生js实现拖动
{{ site.name }}
{{ index }} : {{ site.name }}
补充:vue 自定义指令-拖拽
主要思想： 获取拖拽的dom元素，在oDiv.onmousedown事件内获取鼠标相对dom元素本身的位置：
var disX=ev.clientX-oDiv.offsetLeft;
var disY=ev.clientY-oDiv.offsetTop;
再通过document.onmousemove事件计算dom元素左上角相对 视口的距离：
var l=ev.clientX-disX;
var t=ev.clientY-disY;
oDiv.style.left=l+'px';
oDiv.style.top=t+'px';
完整代码：
总结
以上所述是小编给大家介绍的vue+mousemove实现鼠标拖动功能，希望对大家有所帮助，如果大家有任何疑问请给我留言，小编会及时回复大家的。在此也非常感谢大家对脚本之家网站的支持！
您可能感兴趣的文章:
vue实现图片拖动排序
vue实现移动端拖动排序
基于vue-draggable 实现三级拖动排序效果
vue2 拖动排序 vuedraggable组件的实现
vue Draggable实现拖动改变顺序
vue实现拖动左侧导航栏变大变小
vue实现拖动调整左右两侧容器大小
VUE实现可随意拖动的弹窗组件
Vue 实现拖动滑块验证功能(只有css+js没有后台验证步骤)
Vue中使用elementui与Sortable.js实现列表拖动排序