前段时间公司提一个需求：就是在后台管理页增加banner管理列表，通过拖动列表改变banner顺序。 之前没有遇到过这样的需求，我就在网上找到了Vue.Draggable。感觉效果还不错，这里就写一下使用的心得体会。
首先附上：github地址：https://github.com/SortableJS/Vue.Draggable
github上面的文档都是英文的看不懂，于是找了csdn的这篇中文文档：https://blog.csdn.net/zjiang1994/article/details/79809687
我们的需求是通过拖动给banner排序，那么就必须在拖动完了以后把新的的列表顺序发送给后台。
Vue.Draggable有一个onUpdate方法：排序之后的回调函数，很好这就是我们需要的。就在draggable的模块写 :onUpdate="sortChange()" (sortChange是上传后台的方法)，成功拿到了改变之后的数据也提交到了后台。但是却发现了一个比较严重的问题，就是页面有任何操作的时候都会触发该方，这就很无语了。我又把这些方法都试了一遍，结果都一样。
- onStart: 开始拖动时的回调函数
- onEnd: 拖动结束时的回调函数
- onAdd: 添加单元时的回调函数
于是我又在网上搜解决方法，看到别是都是用的@来替换:on，然后我就也把:on换成@符，之后再试就不能触发事件了。然后又看到有人用的change而不是Update，然后又把Update改成change。再试一下，很完美，再也不随随便触发事件了