table 更改属性设置：
<el-table
ref="multipleTable" :data="tableData" tooltip-effect="dark" style="width: 100%"
@select="select" @row-click="rowClick"
@selection-change="handleSelectionChange"
stripe >
<el-table-column type="selection" width="55" align="center"> </el-table-column>
</el-table>
methods :
rowClick(row, column) {
const selectData = this.selectData;
this.$refs.multipleTable.clearSelection();
if (selectData.length == 1) {
selectData.forEach((item) => {
// 判断 如果当前的一行被勾选, 再次点击的时候就会取消选中
if (item == row) {
this.$refs.multipleTable.toggleRowSelection(row, false);
}
// 不然就让当前的一行勾选
else {
this.$refs.multipleTable.toggleRowSelection(row, true);
}
});
} else {
this.$refs.multipleTable.toggleRowSelection(row, true);
}
},
async select(selection, row) {
await this.$refs.multipleTable.clearSelection(); // 执行完清空操作在进行下面的勾选
if (selection.length === 0) return;
this.$refs.multipleTable.toggleRowSelection(row, true);
},
handleSelectionChange(val) {
this.selectData = val; //表格选中数据接收
},
scss
/deep/.el-table__header-wrapper {
.el-checkbox__inner {
display: none;
}
}