用sortable处理排序，代码真的很少，不需要引用什么vue-sortable之类的。但会有个问题。。实际的DOM和Vnode可能会显示不一致。往往拖完了，序号变了，数据变了（可以通过console.log来查看），但就是DOM没变。
后来是搜索到这篇文章，写的比较详情：https://www.jianshu.com/p/d92b9efe3e6a，我就不多写了。我的几行代码类似如下：
JavaScript代码
- dragable() {
- let contentRow = document.querySelector('.content-row');//指定element，如果有ID最好，在这个下面的元素，最好都是统一类型的，如果当前元素是ul，那就是拖li
- Sortable.create(contentRow, {
- onEnd: ({newIndex, oldIndex}) => { //监听拖动结束事件
- let newline = contentRow.children[newIndex],
- oldline = contentRow.children[oldIndex];
- // 先删除移动的节点 ，再插入移动的节点到原有节点，还原了移动的操作
- //这里是操作DOM
- contentRow.removeChild(newline);
- contentRow.insertBefore(newline, newIndex > oldIndex? oldline : oldline.nextSibling);
- //这里是操作数据
- let currRow = this.items.splice(oldIndex, 1)[0];
- this.items.splice(newIndex, 0, currRow);
- }
- });
- },
这个方法是vue的methods中的。不复杂。看看就行。记录一下。原来我觉得很简单。这个方法的最后两行就行了。。。但就是DOM不变。参考了上面链接中的内容才加了那两行。