「最初の↑に進む」、「前に進む∧」、「後ろに戻る∨」、「最後の↓に戻る」を実現するリストソートボタンの一般的なメソッド。

<el-button
title="向前移动到第一个"
size="mini"
type="primary"
icon="el-icon-top"
:disabled="tableData.length scope.row.value === tableData[0].value :true"
@click.stop="moveToFirst(scope.row)"
circle
plain/>

<el-button
title="向前移动"
size="mini"
type="primary"
icon="el-icon-arrow-up"
:disabled="tableData.length scope.row.value === tableData[0].value :true"
@click.stop="moveToPrev(scope.row)"
circle
plain/>

<el-button
title="向后移动"
size="mini"
type="primary"
icon="el-icon-arrow-down"
:disabled="tableData.length scope.row.value === tableData.slice(-1)[0].value :true"
@click.stop="moveToNext(scope.row)"
circle
plain/>


<el-button
title="向后移动到最后一个"
size="mini"
type="primary"
icon="el-icon-bottom"
:disabled="tableData.length scope.row.value === tableData.slice(-1)[0].value :true"
@click.stop="moveToLast(scope.row)"
circle
plain/>

方法

getIndex(d) {
    return this.tableData.findIndex(v => v.value == d.value);
},
moveToFirst(d) {
    let idx = this.getIndex(d);
    this.tableData.splice(0, 0, this.tableData.splice(idx, 1)[0]);
},
moveToPrev(d) {
    let idx = this.getIndex(d);
    this.tableData.splice(idx - 1, 0, this.tableData.splice(idx, 1)[0]);
},
moveToNext(d) {
    let idx = this.getIndex(d);
    this.tableData.splice(idx + 1 > this.tableData.length - 1 ? 0 : idx + 1, 0, this.tableData.splice(idx, 1)[0]);
},
moveToLast(d) {
    let idx = this.getIndex(d);
    this.tableData.splice(this.tableData.length - 1, 0, this.tableData.splice(idx, 1)[0]);
},

拡張読み取りのアナロジー トップソート トップ、ノントップ アルゴリズム。トップの結果を達成し、ノントップ コンテンツをソートして元のシーケンスを維持します。結果と非スティッキー コンテンツのソートでは、元のシーケンスが維持されます。https://blog.csdn.net/qq_37860634/article/details/131977941