Vue implements image drag and drop function

directives: {
    drag: {
      // Definition of instruction bind: function(el) {
        // Get the current element let oDiv = el;
        oDiv.onmousedown = (e) => {
          // Calculate the position of the mouse relative to the element let disX = e.clientX - oDiv.offsetLeft;
          let disY = e.clientY - oDiv.offsetTop;

          document.onmousemove = (e) => {
            // Subtract the position of the mouse relative to the element from the position of the mouse to get the position of the element let left = e.clientX - disX;
            let top = e.clientY - disY;

            oDiv.style.left = left + 'px';
            oDiv.style.top = top + 'px';
          };
          document.onmouseup = () => {
            document.onmousemove = null;
            document.onmouseup = null;
          }
        }
      }
    }
    }

<div class="card" v-drag id="card">
<img src="../assets/logo.png" >
</div>

.card {
  position: absolute;
  float: left;
  width: 200px;
  height: 200px;

}