vue js实现拖拽

<div class="add-input2" @mousedown.stop.prevent="dragImg" ref='dragImgDom'> //样式一定要定位且有宽高
//内容
</div>
//拖拽
    dragImg(e) {
      this.$refs.dragImgDom.style.cursor = "move";
      this.dragFlag = true;
      this.mouseLeft = e.clientX - parseInt(this.$refs.dragImgDom.offsetLeft);
      this.mouseTop = e.clientY - parseInt(this.$refs.dragImgDom.offsetTop);
      document.onmousemove = e => {
        if (this.dragFlag) {
          this.$refs.dragImgDom.style.cursor = "move";
          this.curX = e.clientX - this.mouseLeft;
          this.curY = e.clientY - this.mouseTop;
          this.$refs.dragImgDom.style.left = this.curX + "px";
          this.$refs.dragImgDom.style.top = this.curY + "px";
        }
      };
      document.onmouseup = () => {
        this.dragFlag = false;
        this.$refs.dragImgDom.style.cursor = "default";
      };
    },
原文地址:https://www.cnblogs.com/houBlogs/p/11858986.html