vue 拖动元素传参

这里演示拖动左侧列表中单元格到右侧内容区 

<div class="tree_root">
    <div class="level_root"">
      <div
        :draggable="draggable"
        @dragstart="treeItemDragstart($event, levelItem)"
        class="level_item"
      >
        <div class="level_title">数据表</div>
         
       </div>
    </div>
   <div
      class="edit"
      contenteditable="true"
      ref="edit"
      @click.right.prevent
      @dragover.prevent
      @drop="dropInfo"
    ></div>
  </div>

<script>
 methods: {
     // 拖动传参
     treeItemDragstart(event, treeItem) {
       //设置属性
      event.dataTransfer.setData("dataType", "add");
      event.dataTransfer.setData("treeItem", 
       JSON.stringify(treeItem));
    },

     // 表拖动后
    dropInfo(event) {
      console.log(event);
      //获取属性
      let dataType = event.dataTransfer.getData("dataType");
      let treeItem = event.dataTransfer.getData("treeItem");
      
    },
   }

<script>