效果如下:

代码:
html:
<el-table v-loading="loading" ref="singleTable" :data="userList" highlight-current-row
@current-change="handleCurrentChange">
<el-table-column label="选择" width="55" align="center">
<template scope="scope">
<el-radio :label="scope.row.userId" v-model="radioId">
<span></span>
</el-radio>
</template>
</el-table-column>
<el-table-column label="用户名称" align="center" key="userName" prop="userName" v-if="columns[1].visible"
:show-overflow-tooltip="true"/>
<el-table-column label="用户昵称" align="center" key="nickName" prop="nickName" v-if="columns[2].visible"
:show-overflow-tooltip="true"/>
</el-table>
JS:
<script>
export default {
props: {
userId: {
type: [Number, String]
}
},
data() {
return {
loading: true,
visible: false,
userList: [],
currentRow: null,
radioId: null,
columns: [
{key: 0, label: `用户编号`, visible: true},
{key: 1, label: `用户名称`, visible: true},
{key: 2, label: `用户昵称`, visible: true}
],
};
},
created(e) {
this.radioId = this.userId;
},
methods: {
handleCurrentChange(row) {
this.radioId = row.userId;
this.currentRow = row;
},
}
};
</script>