Elementui表格组件+sortablejs实现行拖拽排序的示例代码

<el-table v-loading="loading" :default-sort="{prop: 'sortNum', order: 'ascending'}" :data="list" border align="left"> <el-table-column  show-overflow-tooltip  v-for="(item, index) in col"  :key="`col_${index}`"  :prop="col[index].prop"  :label="item.label" >  <template slot-scope="scope">   <p>{{scope.row[item.prop]}}</p>   </template> </el-table-column></el-table>

import Sortable from 'sortablejs'export default { components: { Sortable }, data() { return {  col: [  {   label: '位置',   prop: 'location'  },  {   label: '序号',   prop: 'sortNum'  },  {   label: '经办人',   prop: 'operator'  },  {   label: '操作',   prop: 'isClick'  }  ] } }, mounted() { this.rowDrop() }, methods: {  rowDrop() {  const tbody = document.querySelector('.el-table__body-wrapper tbody')  const _this = this  Sortable.create(tbody, {   onEnd({ newIndex, oldIndex }) {    const currRow = _this.list.splice(oldIndex, 1)[0]    _this.list.splice(newIndex, 0, currRow)    _this.list = _this.list.filter(({ adId }) => adId !== 0)     _this.list.forEach((item, index) => {     _this.sortString += item.adId + ':' + (index + 1) + ','    })    _this.sortString = _this.sortString.substr(0, _this.sortString.length - 1)   }  }) } }}