tableData 列表排序上下移动

<template>

<el-table :data="tableData">

<el-table-column type="index" label="序号" width="50"></el-table-column>

<el-table-column prop="title" label="文章标题" min-width="300" ></el-table-column>

<el-table-column prop="descript" label="文章描述" min-width="300" ></el-table-column>

<el-table-column label="操作(素材排序)" >

<template slot-scope="scope">

<i class="upward-icon" @click.stop="sortUp(scope.$index,scope.row)"></i>

<i class="down-icon" @click.stop="sortDown(scope.$index,scope.row)"></i>

</template>

</el-table-column>

</el-table>

</template>

 

js需要引入Vue模块

import Vue from 'vue'

 

 

js部分：

 

//上移操作

sortUp (index,row) {

let temp = this.tableData[index - 1];

Vue.set(this.tableData, index - 1, this.tableData[index]);

Vue.set(this.tableData, index, temp)

},

 

//下移操作

sortDown (index,row) {

let i = this.tableData[index + 1];

Vue.set(this.tableData, index + 1, this.tableData[index]);

Vue.set(this.tableData, index, i)

},