要做一个拖拽生成的项目,遇到的bug如下,求解答

Question

目前有一个需求,要求从左侧拖拽母体到右侧,要求左侧母体div位置不变,拖动瞬间把左侧的内容传给右侧,并修改部分属性,然后保存右侧位置,生成预览

目前使用的拖拽技术是vue-draggable-resizable插件支持的(插件地址),现在遇到了一个问题:我在拖拽左侧的时候,左侧会跟着动,但是我打印的时候,显示正在拖动的对象是子体,不知道为啥,我看了一下源码,它实质上是在激活的时候传输点击的事件本身,也就是那个e,有谁知道如何改变e吗?我想试试在移动的时候去传递e,把被移动的e换成子体试试,或者你们有什么办法吗?
或者有别的拖拽思路也行!

 // 组件激活,只负责传输新旧数据
    activated(data) {
      if (data.isPrimary) {// isPrimary为true,代表是母体
        // 选择了数据源,立马把选择的,先修改数据(改大小,改判断值,添加唯一id)推到新数据并赋值,可以考虑使用返回新数组的方法
        //toNewDragItem 用来暂存
        this.toNewDragItem = JSON.parse(JSON.stringify(data)) // 把数据赋值到暂存区域
        this.toNewDragItem.width = 150
        this.toNewDragItem.height = 150
        this.toNewDragItem.isPrimary = false
        this.toNewDragItem.id = new Date().getTime()
        let index = this.configuration.data_list.options.push(JSON.parse(JSON.stringify(this.toNewDragItem)))
        this.activeComponent = this.configuration.data_list.options[index - 1]
      } else {
        this.activeComponent = data
      }
      // this.dragItemsId = this.activeComponent.id // 暂存被选中的数据源id
      console.log(data, '激活')
    },

    onDrag(left, top) {
      // 拖动事件,修改div位置
      this.$set(this.activeComponent, 'x', left)
      this.$set(this.activeComponent, 'y', top)
      // console.log(this.activeComponent)
    },