先设置row-key属性-》再设置 :reserve-selection="true"属性即可。
<!-- $root为APP.vue组件中变量:this.screenHeight = window.innerHeight -->
<el-table
ref="singleTable"
v-loading="loading"
:header-cell-style="{ background:'#eef1f6', color:'#606266'}"
:max-height="$root.screenHeight/2"
:data="list"
highlight-current-row
:row-key="getRowKey"
@selection-change="handleSelectionChange"
>
<el-table-column type="selection" :reserve-selection="true" width="55" />
<el-table-column label="序号" width="60">
<template slot-scope="scope">
{{ scope.$index+(listQuery.page - 1) * listQuery.page_size + 1 }}
</template>
</el-table-column>
</el-table>
<script>
export default {
data() {
listQuery: {
page: 1,
page_size: 10
},
selectedList: []
},
methods: {
// 返回行的唯一标志
getRowKey(row) {
return row.user_id
},
// 保存勾选的数据
handleSelectionChange(selectedList) {
this.selectedList = selectedList
}
}
}
</script>