vxe-table和sortablejs结合，实现从一个表拖拽数据到另一个表中的功能

VxeTable是一款基于Vue.js的高性能表格组件，它提供了丰富的API和易于定制的特点。SortableJS是一个JavaScript库，用于处理列表、网格或其他元素的排序。要将这两个库结合，实现从一个VxeTable中的数据拖拽到另一个Table中，你可以按照以下步骤操作：

1. 首先，在你的项目中引入两个库的依赖，通常通过npm或yarn安装：

   npm install vxe-table sortablejs

2. 安装并配置SortableJS，以便能够创建可拖动的列。在Vue组件中，给需要拖拽的列添加`draggable`属性：

   <vxe-table :data="tableData" :columns="columns">
     <!-- ... -->
     <template slot-scope="scope">
       <!-- 如果列支持拖拽 -->
       <td v-if="sortColumn === scope.column.field"
           @mousedown="startDrag(scope.row)" 
           @mouseup="stopDrag()"
           draggable="true"
           :data-row-index="scope.$index">
         {{ scope.row[scope.column.field] }}
       </td>
     </template>
   </vxe-table>

3. 在JS中设置拖拽开始和结束事件处理器：

   data() {
     return {
       sortColumn: null,
       isDragging: false,
       // ...
     }
   },
   methods: {
     startDrag(row) {
       this.isDragging = true;
       this.sortColumn = row.key; // 或者根据需要的列名
     },
     stopDrag() {
       this.isDragging = false;
     },
     // 添加必要的移除、添加新行等业务处理逻辑
     handleDrop(event) {
       // 根据event.newIndex在目标表中插入或更新数据
     },
   },
   mounted() {
     // 初始化SortableJS实例
     const Sortable = require('sortablejs');
     if (this.sortColumn) {
       this.$refs.tableBody.sortable = new Sortable(this.$refs.tableBody, {
         // 设置SortableJS选项
       });
     }
   }

4. 当拖动完成时，监听SortableJS的`end`事件，根据新的索引调整源表的数据，并在`handleDrop`方法中处理目标表的数据。

5. 最后，记得在`beforeDestroy`生命周期钩子中销毁SortableJS实例，以避免内存泄漏：

beforeDestroy() {
  if (this.$refs.tableBody.sortable) {
    this.$refs.tableBody.sortable.destroy();
  }
}