el-table和sortablejs实现行拖拽，遇到的坑

1.：下载安装
npm i sortablejs
2.script部分代码

mounted(){
    this.rowDrop()
},
methods:{
    rowDrop() {//定义方法
      const tbody = document.querySelector('.el-table__body-wrapper tbody')
      const _this = this
      Sortable.create(tbody, {
        animation: 180,
        delay: 0,
        onEnd({ newIndex, oldIndex }) {//拖拽后的回调
            //更改表格数据，与拖拽index统一
          const currRow = _this.filterTableData.splice(oldIndex, 1)[0]
          _this.filterTableData.splice(newIndex, 0, currRow)
          
        console.log(_this.filterTableData)
        }
      })
    }
}

3.HTML代码  表格代码

<el-table border :data="tableData" height="76vh" row-key="id">
      <el-table-column prop="order_index" label="序号"> </el-table-column>
      <el-table-column prop="name" label="关键词组">
        <!-- <template #default="scope">
          <el-input v-model="scope.row.name" type="text" placeholder="请填写" />
        </template> -->
      </el-table-column>
      <el-table-column label="操作" width="150px">
        <template #default="scope">
          <el-button size="small" @click="editName(scope.$index, scope.row)">重命名</el-button>
          <el-button size="small" type="danger" @click="handleDelete(scope.$index, scope.row)"
            >删除</el-button
          >
        </template>
      </el-table-column>
    </el-table>

到这里本该结束了，轻车熟路（以前使用过一次）。但是！！！转折来了这次使用拖拽后表格中的显示的始终都不是自己拖拽后的，但是打印出表格数据又是正确的。非常奇怪。翻了下以前写的代码跟这次写的一摸一样但是这次拖动后显示的数据始终都不是拖拽后的样子。
找了很久，大概三个小时的问题，各种骚操作想了一大堆。最后打算放弃了。删除的代码的时候发现这里使用的是假数据，对象中并没有ID字段。我把对象中加上ID字段，再次拖动就好了。真是服了。把这个唯一标识忘得一干二净！！！！！

记录下我的二货问题