Table表格控件实现单选功能
javascript
<el-table
ref="tableRef"
height="385"
style="--el-table-border-color: none"
row-key="contractId"
highlight-current-row
single-select
@select="handleSelect"
:data="contractInfo">
<el-table-column type="selection" width="30" :selectable="isSelectable" />
<el-table-column label="" prop="contractName" />
<el-table-column label="" prop="contractProvider" width="120" />
<el-table-column label="" prop="expirationTime" width="150" />
</el-table>
javascript
/* 单选逻辑*/
const handleSelect = (item: Array<SelectItem>) => {
if (item.length > 1) {
const del_row = item.shift()
tableRef.value.toggleRowSelection(del_row, false) //设置单选逻辑
}
}
实现效果: