Vue拖拽div移动位置

 

css

#TestDiv
{ 
  position: absolute;
  left: 50%;
  top: 50%;
  width: 100px;
  height: 100px;
  z-index: 999;
  background-color: red;
}

处理函数

const OnMouseDown=(e:any)=>
{
  let videoBox:any = document.getElementById("TestDiv");
  let disX = e.clientX - videoBox.offsetLeft;
  let disY = e.clientY - videoBox.offsetTop;

  document.onmousemove=function(e)
  {
     let left = e.clientX - disX;
     let top = e.clientY - disY;
    videoBox.style.left = left + 'px';
    videoBox.style.top = top + 'px';
  }

  document.onmouseup=function(e)
  {
    document.onmousemove = null;
    document.onmouseup = null;
  }
}