通过结合el-radio组件实现。
<el-table
:header-cell-style="{background: '#eef1f6',color: '#606266'}"
ref="singleTable"
:data="list"
fit
:border="true"
highlight-current-row
>
<el-table-column label="单选" width="50">
<template slot-scope="{row}">
<el-radio v-model="currentSelectedRow" :label="row">{{""}}</el-radio>
</template>
</el-table-column>
<el-table-column prop="store_name" label="仓库名"></el-table-column>
<el-table-column>
<template slot-scope="{row, $index}">
<el-button type="text" @click.native.prevent="deleteRow($index, list)"></el-button>
</template>
</el-table-column>
</el-table>
<script lang="ts">
...
private currentSelectedRow = null // 单选:勾选的行对象
private list = []
private deleteRow(index, rows) {
rows.splice(index, 1);
}
...
</script>