使用方法：sortablejs
第一步：安装sortablejs
npm install sortablejs --save
第二步：在需要的页面引入
import Sortable from 'sortablejs'
第三步：表格样式
<el-table:data="tableData"ref="dragTable"class="draggable"row-key="id"borderhighligh-current-row><el-table-column prop="date" label="Date" /><el-table-column prop="name" label="Name" /><el-table-column prop="address" label="Address" /><el-table-column prop="handel" label="排序"><template #default="{}"><el-icon class="drag-hander" :size="20"><Rank /></el-icon></template></el-table-column></el-table>
第四步：定义数组
tableData: [{id: 1,date: '2016-05-02',name: 'wangxiaohu',address: 'No. 189, Grove St, Los Angeles',},{id: 2,date: '2016-05-04',name: 'wangxiaohu',address: 'No. 189, Grove St, Los Angeles',},{id: 3,date: '2016-05-01',name: 'wangxiaohu',address: 'No. 189, Grove St, Los Angeles',},{id: 4,date: '2016-05-03',name: 'wangxiaohu',address: 'No. 189, Grove St, Los Angeles',},],
第五步：方法实现
methods: {rowDrop() {const tbody = document.querySelector('.draggable .el-table__body-wrapper tbody');if (!tbody) {return;}Sortable.create(tbody, {// Sortable 配置项draggable: '.draggable .el-table__row',onEnd: this.handleSortEnd, // 处理拖拽结束后的逻辑});},handleSortEnd(event) {if (event.oldIndex !== undefined && event.newIndex !== undefined) {const { oldIndex, newIndex } = event;const movedItem = this.tableData.splice(oldIndex, 1)[0];this.tableData.splice(newIndex, 0, movedItem);}},},
参考链接：https://www.jb51.net/javascript/31103517b.htm
