https://element.eleme.cn/#/zh-CN/component/table
每次点击下一页时,将勾选的数据保存起来,去重,并从保存起来的数据中找出本页需要自动勾选的数据
if (Array.isArray(this.selectedCourseRowTemp)) {
const moreData = [
...this.selectedCourseRowTemp,
...this.selectedCourseRow,
];
let resultData = [];
for (let i = 0; i < moreData.length; i++) {
let repeat = false;
for (var j = 0; j < resultData.length; j++) {
if (moreData[i].id === resultData[j].id) {
repeat = true;
break;
}
}
if (!repeat) {
resultData.push(moreData[i]);
}
}
this.selectedCourseRowTemp = resultData;
}
this.$nextTick(() => {
setTimeout(() => {
const needSelectRows = this.tableData.filter((item) => {
let resultTempItemIndex = -1;
if (Array.isArray(this.selectedCourseRowTemp)) {
resultTempItemIndex = this.selectedCourseRowTemp.findIndex(
(tempItem) => {
return item.id === tempItem.id;
}
);
}
return resultTempItemIndex >= 0;
});
// const rows = [this.tableData[1]];
this.handleAutoSelect(needSelectRows);
}, 100);
});
<el-table
ref="multipleTable"
:data="tableData"
border="true"
height="350"
style="width: 100%"
tooltip-effect="dark"
highlight-current-row
@selection-change="handleSelectCourseChangeMult"
:option="option"
@row-click="handleClickCourseRowMult"
></el-table>
handleTest() {
const rows = [this.tableData[1]];
if (rows) {
rows.forEach((row) => {
this.$refs.multipleTable.toggleRowSelection(row, true);
});
} else {
this.$refs.multipleTable.clearSelection();
}
},
handleAutoSelect(rows) {
if (rows) {
rows.forEach((row) => {
this.$refs.multipleTable.toggleRowSelection(row, true);
});
} else {
this.$refs.multipleTable.clearSelection();
}
},
handleClickCourseRowMult(row) {
if (row) {
this.selectedCourseRow = row;
this.$refs.multipleTable.toggleRowSelection(row);
} else {
this.$refs.multipleTable.clearSelection();
}
},
handleSelectCourseChangeMult(selection) {
this.selectedCourseRow = selection;
},