element-ui 中 el-table 相关操作
1、带checkbox 获取所有选择的行。
this.$refs.multipleTable.selection
获取选中的单行
this.$refs.roleTable.store.states.currentRow
2、点击某行选中复选框
@row-click="rowClick"
rowClick (row) {
this.$refs.multipleTable.toggleRowSelection(row)
}
3、获取当前行序号
scope.$index
<template slot-scope="scope">
<el-button size="mini" icon="el-icon-top" @click="moveUp(scope.$index)">上移</el-button>
<el-button size="mini" icon="el-icon-bottom" @click="moveDown(scope.$index)">下移</el-button>
</template>
4、表格上移,下移
moveUp(rowIndex){ if(rowIndex == 0){ this.$message({ message:'顶行无法上移!', type:'warning' }) }else{ let row = this.tableData[rowIndex - 1] this.tableData.splice(rowIndex - 1, 1) this.tableData.splice(rowIndex,0, row) } }, moveDown(rowIndex){ if ((rowIndex + 1) === this.tableData.length){ this.$message({ message:'已经是最后一条,不可下移!', type:'warning' }) } else { let row = this.tableData[rowIndex + 1] this.tableData.splice(rowIndex + 1, 1) this.tableData.splice(rowIndex,0, row) } }
青春承载希望,奋斗成就未来