Vue.js+Element：表格行拖曳

<template>
  <!-- 务必指定row-key，row-key必须是唯一的，不然会出现排序不对的情况 -->
  <el-table
    :data="tableData"
    row-key="date"
    style="width: 100%">
    <el-table-column prop="date" label="日期" width="180"/>
    <el-table-column prop="name" label="姓名" width="180"/>
    <el-table-column prop="address" label="地址" width="260"/>
    <el-table-column align="center" label="Drag" width="130">
      <template slot-scope="{}">
        <svg-icon class="drag-handler" icon-class="drag" />
      </template>
    </el-table-column>
  </el-table>
</template>

<script>
import Sortable from 'sortablejs'
// 引用sortablejs 使用npm install sortablejs --save安装Sortable.js
export default {
  data() {
    return {
      tableData: [{
        date: '2016-05-02',
        name: '王小虎',
        address: '上海市普陀区金沙江路 1518 弄'
      }, {
        date: '2016-05-04',
        name: '王小虎',
        address: '上海市普陀区金沙江路 1517 弄'
      }, {
        date: '2016-05-01',
        name: '王小虎',
        address: '上海市普陀区金沙江路 1519 弄'
      }, {
        date: '2016-05-03',
        name: '王小虎',
        address: '上海市普陀区金沙江路 1516 弄'
      }]
    }
  },
  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.tableData.splice(oldIndex, 1)[0]
          _this.tableData.splice(newIndex, 0, currRow)
        }
      })
    }
  }
}
</script>

参考：element表格行列拖拽