簡單來說,就是把el-table的多選改成單選
效果圖.png
<el-table
v-loading="loading"
:data="list"
class="typeTable"
@select="handleSelectionChange"
>
<el-table-column
type="selection"
width="55"
align="center"
/>
<el-table-column
label="XXXX"
align="center"
prop="XXX"
/>
</el-table>
// 選中數據
//原理就是取消所有選擇，再選中點擊的，達到單選效果
handleSelectionChange(selection) {
if (selection.length > 1) {
this.$refs.typeTable.clearSelection();
this.$refs.typeTable.toggleRowSelection(selection.pop());
}
}
//隱藏全選框
.typeTable {
::v-deep .el-table__header-wrapper {
.el-table-column--selection {
.el-checkbox {
display: none !important;
}
}
}
}
