ElementUI表格實現只能單選效果
設置樣式隱藏表格全選
<style>
.single-select-table thead .el-table-column--selection .cell {
display: none;
}
</style>
table設置隱藏全選樣式,加上@selection-change="handleSelectionChange"
實現單選,ref設置個table作為ref引用
<el-table :data="page.rows" ref="table" border tooltip-effect="light" @selection-change="handleSelectionChange" class="single-select-table">
<!--選擇框勾選-->
<el-table-column type="selection" width="55" align="center"></el-table-column>
<el-table-column label="產品編碼" prop="objId"></el-table-column>
<el-table-column label="xml" prop="fileCName"></el-table-column>
<el-table-column label="創建人" prop="creator"></el-table-column>
<el-table-column label="創建時間" prop="createTime"></el-table-column>
<el-table-column label="修改人" prop="modifier"></el-table-column>
<el-table-column label="修改時間" prop="modifyTime"></el-table-column>
</el-table>
handleSelectionChange方法具體實現
handleSelectionChange(rows) {
if (rows.length > 1) {
this.$refs.table.clearSelection()
this.$refs.table.toggleRowSelection(rows.pop())
}
},