html部分需要注意 在标间内加入:row-key="getRowKeys"属性绑定唯一属性id,以及在勾选框一栏添加:reserve-selection="true"属性
<el-table
ref="personList"
v-loading="loading"
:data="personList"
tooltip-effect="dark"
:row-key="getRowKeys"
@selection-change="handleSelectionChange">
<el-table-column
type="selection"
:reserve-selection="true"
width="55">
</el-table-column>
<el-table-column
label="序号"
type="index"
width="50">
</el-table-column>
<el-table-column
prop="name"
label="姓名"
width="120">
</el-table-column>
<el-table-column
prop="resourceType"
label="身份类别"
show-overflow-tooltip>
</el-table-column>
<el-table-column
prop="no"
label="学号/工号"
show-overflow-tooltip>
</el-table-column>
</el-table>
需要注意的是:
1、你的需要回显的id数据不能比列表数据先获取到,因为你toggleAllSelection的时候,列表还没渲染,你应该把这个放在列表渲染后
2、拿到列表数据后,根据pagebingAgentdata检索列表项中存在的数据,这可以使用id去匹配,找到后使用toggleRowSelection进行勾选
以下是script部分
//this.pagebingAgentdata为需要回显默认勾选的数据
let rowids = this.pagebingAgentdata.map(item => item.agentId)
this.personList.forEach(item => {
if(rowid.includes(item.id)){
this.$refs.personList.toggleRowSelection(item)
}
})