vuedraggable 是一款拖拽元素的插件。
插件地址：https://www.npmjs.com/package/vuedraggable

插件使用起来还是很简单的，官网给出了例子：

<draggable v-model="myArray" :options="{group:'people'}" @start="drag=true" @end="drag=false">
   <div v-for="element in myArray" :key="element.id">{{element.name}}</div>
</draggable>

这样便能实现代码拖拽的问题了。其中的start和end分别代表了代码开始拖拽事件和代码拖拽事件结束，可以给他设置方法。

在我最近开发时遇到了一个问题，当鼠标拖拽元素时，鼠标在元素内应该是这种样式：

但是我的鼠标却是这种脱离元素的样式：

关于这个问题我开始对比我的代码，然后重新写demo发现代码都是一样的，demo也能实现，一直没有找到问题的关键所在，然后我重新还原了我的package，发现问题得到了解决。至于原因，还没有找到，后面会继续探索这些问题。