v-drag:实现拖拽功能

v-drag

鼠标拖动
directives: {
drag: function(el) {
let dragBox = el // 获取当前元素
let num = null
dragBox.onmousedown = e => {
// 算出鼠标相对元素的位置
const disX = e.clientX - dragBox.offsetLeft
document.onmousemove = e => {
// 用鼠标的位置减去鼠标相对元素的位置，得到元素的位置
const left = e.clientX - disX
// 移动当前元素
if (left > -300 && left < 0) {
dragBox.style.left = left + ‘px’
}
}
document.onmouseup = e => {
// 鼠标弹起来的时候不再移动
document.onmousemove = null
// 预防鼠标弹起来后还会循环(即预防鼠标放上去的时候还会移动)
document.onmouseup = null
}
}
}
},