vue - 自定义指令 -拖拽
directives: {
go: {
inserted(el) {
el.style.position = 'absolute'
el.onmousedown = function (event) {
var sx = event.clientX - el.offsetLeft
var sy = event.clientY - el.offsetTop
document.onmousemove = function (event) {
var bigW = document.getElementById('box').offsetWidth
var elW = el.offsetWidth
var bigH = document.getElementById('box').offsetHeight
var elH = el.offsetHeight
var x = event.clientX - sx
if (x > bigW - elW) {
x = bigW - elW
}
if (x < 0) {
x = 0
}
var y = event.clientY - sy
if (y > bigH - elH) {
y = bigH - elH
}
if (y < 0) {
y = 0
}
el.style.left = x + 'px'
el.style.top = y + 'px'
}
el.onmouseup = function () {
document.onmousemove = null
}
}
},
},
},
}