<el-table
:data="dataList"
border
size="medium"
height="350"
v-loading="loading"
:row-key="getRowKeys"
reserve-selection
stripe
ref="myTable"
@selection-change="handleSelectionChange"
>
<el-table-column type="selection" width="55" :reserve-selection="true">
// methods 中设涉及方法
init(row) {
this.transformList = row;
this.refreshList();
this.visible = true;
},
// 获取数据完成后执行默认选择操作
refreshList() {
this.loading = true;
this.$http({
url: this.$http.adornUrl("Api/support"),
method: "get",
params: this.$http.adornParams({
page: this.page,
pageSize: this.limit,
...this.searchForm,
}),
}).then(({ data }) => {
if (data.code === 0 && data.msg === "success") {
this.dataList = data.page.list;
this.dataList = this.dataList.map((ele) => {
ele.isSelected = this.transformList.find(
(val) => val.materialId == ele.materialId
)
? true
: false;
return ele;
});
// 设置默认勾选
this.$nextTick(() => {
this.dataList.forEach((element) => {
if (element.isSelected) {
this.$refs.myTable.toggleRowSelection(element, true);
} else {
this.$refs.myTable.toggleRowSelection(element, false);
}
});
});
this.total = data.page.total;
} else {
this.$message.warning(data.msg);
}
this.loading = false;
});
},