官方样例:自定义指令
<div class="box" v-drag></div>
.box {
width: 100px;
height: 100px;
background: orange;
}
directives: {
//指令2
drag: {
// 指令的定义
inserted: function (el) {
console.log("el2",el)
el.style.position='absolute'
el.οnmοusedοwn=function(ev){
console.log('ev',ev)
var sX=ev.clientX-el.offsetLeft;
var sY=ev.clientY-el.offsetTop;
document.οnmοusemοve=function(ev){
var eX=ev.clientX-sX;
var eY=ev.clientY-sY;
// 不断的更新元素的left、top值
el.style.left=eX+'px'
el.style.top=eY+'px'
}
document.οnmοuseup=function(){
// 清除mousemove事件
document.οnmοusemοve=null;
}
}
},
},
},