vue-draggable撤销拖拽

要实现撤销拖拽，你可以使用 `vuedraggable` 组件的 `@start` 事件和 `@end` 事件来监听拖拽的开始和结束，然后在拖拽结束时恢复原始的顺序。以下是一个示例：

<template>
  <div>
    <draggable v-model="list" @start="onDragStart" @end="onDragEnd">
      <!-- your draggable items -->
    </draggable>
    <button @click="undoDrag">撤销</button>
  </div>
</template>

<script>
import draggable from 'vuedraggable';

export default {
  components: {
    draggable
  },
  data() {
    return {
      list: [/* your list of items */],
      originalList: [] // 保存原始顺序的副本
    };
  },
  methods: {
    onDragStart() {
      // 在拖拽开始时保存原始顺序的副本
      this.originalList = [...this.list];
    },
    onDragEnd() {
      // 拖拽结束时不做任何操作
    },
    undoDrag() {
      // 恢复原始顺序
      this.list = [...this.originalList];
    }
  }
};
</script>

在上述示例中，我们使用 `onDragStart` 方法在拖拽开始时保存原始顺序的副本，然后在 `undoDrag` 方法中恢复原始顺序。你可以根据需要自定义这些方法并调整代码以适应你的实际情况。