H5 长按 拖拽排序的实现 以及 vuedraggable的使用

H5 长按拖拽排序

产品需求: H5页面的一个列表,需要长按之后 然后拖拽排序;

解决方案: 使用 vuedraggable 组件;

vuedraggable是vue生态圈中一个知名的组件,也是vue.js项目中处理拖拽问题的不二法宝;
它基于Sortable.js打造,因此,其功能之强大,配置之丰富,在这里也毋庸赘言了;
由于其供了Sortable.js的所有特性, 所以配置也直接移步Sortable.js文档就可以了

具体方法:

---

安装vuedraggable

    npm i -S vuedraggable

然后就是引入使用,下面代码主要是 配置在H5页面上的长按拖拽 所以要在真机上调试,PC浏览器的模拟器长按拖拽可能会失效