需求：table排序，可操作排序上移下移功能。判斷第一行上移禁用和最后一行下移禁用，排序根據(jù)后端返回的字段

 <el-table:data="tableData"style="width: 100%"><el-table-column type="index" label="序號" align="center" min-width="50"><template slot-scope="scope"><span>{{ scope.$index + (pageNum - 1) * pageSize + 1 }}</span></template></el-table-column><el-table-columnprop="name"label="編號"width="180"></el-table-column><el-table-columnprop="address"label="排序"><template slot-scope="scope"><el-buttontype="text"disabled={index === 0}@click={e => this.sortFunction(e, row, "1")}>上移</el-button><el-buttontype="text"disabled={index === this.tableData.length - 1}@click={e => this.sortFunction(e, row, "2")}>下移</el-button></el-table-column></el-table-column><el-table-column prop="address" label="操作" min-width="200" align="center"><template slot-scope="scope"><el-button>編輯</el-button><el-button  @click="handleDelete(scope.row)">刪除</el-button></template></el-table-column></el-table>

sortFunction(e, row, type) {changeSort({//排序接口sortType: type,templateConfigId: row.templateConfigId}).then(res => {if (res.code === 200) {this.getList();//獲取表格接口}});},

按鈕上一條下一條功能

            <div class="right-bottom"><el-buttonclass="end-upon btns":disabled="uponindex === 0":class="isEndBtn === true ? 'isActive' : ''"@click="endUponClick()">上一條</el-button><el-buttonclass="end-next btns":disabled="isDisabled":class="isNextBtn === true ? 'isActive' : ''"@click="endNextClick()">下一條</el-button></div>

//上一條按鈕endUponClick() {//存老的值 oldNamelet oldName = this.activeName;//this.activeName 當(dāng)前選中的那一條數(shù)據(jù)let addNum = this.activeName - 1;this.tabsList.forEach((item, index) => {if (addNum === 0) {this.isEndBtn = true;this.isBtnDisabled = true;this.isNextBtn = false;this.$message({message: '此項(xiàng)為第一條數(shù)據(jù)',type: 'warning'});}if (addNum === item.sort) {this.activeName = addNum;if (item.testStatus === '2') {this.onSetShow = true;} else {this.onSetShow = false;}//當(dāng)前選中的那一條this.tabsList.forEach(v => {if (oldName === v.sort) {this.contentCode = v.contentCode;this.debugContent = v.debugContent;this.testStatus = v.testStatus;this.dataRecordResultList = v.dataRecordResult;}});this.isEndBtn = true;this.isNextBtn = false;this.activeName = addNum;this.updateInfo(this.dataRecordResultList);}});},//下一條按鈕endNextClick() {//存老的值 oldNamelet oldName = this.activeName;//this.activeName 當(dāng)前選中的那一條數(shù)據(jù)let addNum = this.activeName + 1;let lengthNum = this.tabsList.length + 1;this.tabsList.forEach((item, index) => {if (addNum === lengthNum) {this.isNextBtn = true;this.isEndBtn = false;this.isBtnDisabled = true;this.$message({message: '此項(xiàng)為最后一條數(shù)據(jù)',type: 'warning'});} else {if (addNum === item.sort) {this.activeName = addNum;if (item.testStatus === '2') {this.onSetShow = true;} else {this.onSetShow = false;}//當(dāng)前選中的那一條this.tabsList.forEach(v => {if (oldName === v.sort) {this.contentCode = v.contentCode;this.debugContent = v.debugContent;this.testStatus = v.testStatus;this.dataRecordResultList = v.dataRecordResult;}});this.isNextBtn = true;this.isEndBtn = false;this.activeName = addNum;this.updateInfo(this.dataRecordResultList);}}});},