element-ui table行点击获取行索引(index)并利用索引更换行顺序

在使用 element-ui 的 table 组件时，可以通过设置 row-click 事件来获取点击行的索引。在获取到索引后，可以利用 Vue.js 提供的数组操作 API 来更改表格的数据源，从而达到更换行顺序的效果。

具体实现步骤如下：

1. 在 table 组件上添加 row-click 事件：

<el-table @row-click="handleRowClick"></el-table>

2. 在 Vue 实例中定义 handleRowClick 方法来处理行点击事件，并获取点击行的索引：

methods: {
  handleRowClick(row) {
    const index = this.tableData.indexOf(row);
  },
}

3. 利用索引来更改表格数据：

methods: {
  handleRowClick(row) {
    const index = this.tableData.indexOf(row);
    const newData = this.tableData.slice(); // 复制一份数据源
    newData.splice(index, 1); // 删除被点击的行
    newData.unshift(row); // 将被点击的行插入到数组最前面
    this.tableData = newData; // 更新数据源
  },
}

通过以上方法，我们可以实现表格行点击获取行索引并利用索引更换行顺序的功能。具体实现可以根据业务场景进行调整和优化。