如果要考虑到翻页后默认选中的数据,需要监听列表变化
模板代码
<el-table
v-loading="isLoading"
:data="listData"
@selection-change="handleSelectionChange"
...
>
<el-table-column type="selection" :reserve-selection="true" width="50"></el-table-column>
<!-- 其他表格列 -->
</el-table>
js代码
data() {
return {
parentData: [], //其他页面传来的数据
listData:[],//表格数据
}
},
watch:{
listData(){
handler(val, oldval) {
if(val) {
// 遍历当前列表数据
const set = new Set(this.listData.map(item => item.id))
// 与传来的数据匹配
this.parentData.forEach(item2 => {
// 如果含有该id
if (set.has(item2.id)) {
// 找到位置
const target = this.listData.find(item => item.id === item2.id)
//选中
this.$refs.tableData.toggleRowSelection(target, true)
}
})
}
},
deep: true,
}
},
methods: {
getList(){
this.$net('url','get').then(res => {
if(res.code === 200){
this.listData = res.data
}
})
}
},