Vue实现table上下移动排序

基于element-ui框架：

================ data ===================
HotTableList:[]

================ html ===================
<template v-slot="scope">
    <el-button  @click="upindex(scope.$index,scope.row)">上移</el-button>
    <el-button  @click="downindex(scope.$index,scope.row)">下移</el-button>
</template>

================ 上移 ===================
upindex(index, row) {
if (index > 0) {
let upDate = this.HotTableList[index - 1];
this.HotTableList.splice(index - 1, 1);
this.HotTableList.splice(index, 0, upDate);
} else {
this.$message.warning(“已经是第一条了！”);
return false;
}
},

================ 下移 ===================
downindex(index, row) {
if (index + 1 === this.HotTableList.length) {
this.$message.warning(“已经是最后一条了！”);
return false;
} else {
let downDate = this.HotTableList[index + 1];
this.HotTableList.splice(index + 1, 1);
this.HotTableList.splice(index, 0, downDate);
}
},