vue拖拽功能

<div class='drag-div' id="drag" @drop='drop($event)' @dragover='allowDrop($event)'
                 @dragleave="dragLeave($event)" @dragenter="dragEnter($event)">
              <label class='drag-people-label'></label>
              <span class='measure' v-for="item in dragFrom.measures" :key="item.id" draggable='true' @dragstart='drag($event)'>
                  {{item.column}}
              </span>
</div>
<!-- 目标拖动  -->
<div class='measure' id='center' @drop='drop($event)' @dragenter="dragEnter($event)"
                 @dragover='allowDrop($event)' @dragleave="dragLeave($event)">
              <label class="columFont">数值：</label>
              <span  v-for="(item, index) in dragTo.values" :key="item.column" draggable='true'
                    @dragstart='drag($event,index,"1")' @click="goback(item,'measure')" :id="item.column"
                  style="background-color: #5bc0de;display: inline-block;text-align: center;border-radius: 3px;
                  margin-right: 10px;cursor: pointer;padding: 5px 10px;color: #fff;margin-top: 10px;font-size:12px;">
                  {{item.column}}
              </span>
</div>

goback(val, type) {
      if (type === 'measure') {
        if (val.type === 'column') {
          this.dragFrom.measures.push(val)
          this.dragTo.values.forEach((item, index) => {
            if (item.alias === val.alias) {
              this.dragTo.values.splice(index, 1)
            }
          })
        }
      }
},
drag: function(event,index,val) {
      if(val==='1'){
        event.dataTransfer.setData('Text', index);
      }
      const data = {
        isVal:val?val:'',
        type: event.target.className,
        value: event.target.innerText.replace(/(^\s*)|(\s*$)/g, '')
      }
      this.dragData = data
},
 drop: function(event) {
      if (event.target.innerText.indexOf('数值') !== -1) {
        if (this.dragData.isVal==='1') {
          let arr = this.dragTo.values.concat([])
          let dragIndex = event.dataTransfer.getData('Text');
          let temp = arr.splice(dragIndex, 1);
          arr.splice(arr.length, 0, temp[0]);//一直加到最后面
          this.dragTo.values = arr;
          console.log(this.dragTo.values)
        } else {
          this.dragFrom.measures.forEach((item, index) => {
            if (item.alias === this.dragData.value) {
              this.dragTo.values.push(item)
              this.dragFrom.measures.splice(index, 1)
            }
          })
        }
      }
      event.preventDefault()
},
allowDrop: function(event) {
      event.preventDefault()
},
dragLeave(event) {
      event.preventDefault()
},
dragEnter(event) {
      event.preventDefault()
},