image.png
1、默认禁用效果
禁用用selectable控制
<el-table-column type="selection" width="55" :reserve-selection="true" :selectable="selectEnable" />
table的list数据需要有个字段标识是否禁用 例如canChoose
selectEnable(row, rowIndex) { // 复选框可选情况
if (!row.canChoose) { // 禁用
return false;
} else {
return true;
}
},
2、默认选中效果
是否选中： this.$refs.multipleTable.toggleRowSelection(row, boolean)
// 请求后拿到tableList后
this.tableData.forEach((item, index) => {
if (!item.canChoose) {
// 默认被选中且禁用
this.$refs.multipleTable.toggleRowSelection(item, true); // 如果只需要禁用 不需要这行
}
// selectReady 是默认要选中的数据
if (this.selectReady.length > 0) {
this.selectReady.forEach((obj, key) => {
if (item.id == obj) { // 如果匹配上 代表当前角色下的用户 高亮选中
setTimeout(() => {
this.$refs.multipleTable.toggleRowSelection(item, true);
}, 100)
}
})
}
})
