vue+ts实现元素鼠标拖动效果

本文实例为大家分享了vue+ts实现元素鼠标拖动效果的具体代码，供大家参考，具体内容如下

实现效果

相关使用属性

// clientX 鼠标相对于浏览器左上角x轴的坐标； 不随滚动条滚动而改变；
// clientY 鼠标相对于浏览器左上角y轴的坐标； 不随滚动条滚动而改变；
// element.offsetTop 指 element距离上方或上层控件的位置，整型，单位像素。
// element.offsetLeft 指 element距离左方或上层控件的位置，整型，单位像素。
// element.offsetWidth 指 element控件自身的宽度，整型，单位像素。
// element.offsetHeight 指 element控件自身的高度，整型，单位像素。
//  clientHeigh = height + 上下padding
//   clientWidth = width+左右padding

实现完整代码

参考来源：用JavaScript实现div的鼠标拖拽效果

以上就是本文的全部内容，希望对大家的学习有所帮助，也希望大家多多支持脚本之家。