el-table中实现单选按钮

QQ图片20210830160115.png

<el-table max-height="300" :data="list" highlight-current-row @row-click="rowClick">
    <el-table-column label width="35">
        <template slot-scope="scope">
            <el-radio :label="scope.row.name" v-model="radioId">&nbsp;</el-radio>
        </template>
    </el-table-column>
    <el-table-column label="序号" width="120" prop="account"></el-table-column>
    <el-table-column label="照片" width="100">
        <template slot-scope="scope">
            <img class="img-url" :src="scope.row.url" alt="">
        </template>
    </el-table-column>
    <el-table-column label="姓名" width="100" prop="name"></el-table-column>
    <el-table-column label="性别" width="100" prop="sex"></el-table-column>
    <el-table-column label="部门" width="100" prop="department"></el-table-column>
    <el-table-column label="岗位" width="100" prop="job"></el-table-column>
</el-table>
<script>
    export default{
        methods:{
            rowClick(row){
                this.radioId=row.name;
            }
        }
    }
</script>

————————————————
版权声明：本文为CSDN博主「Muizai」的原创文章，遵循CC 4.0 BY-SA版权协议，转载请附上原文出处链接及本声明。
原文链接：https://blog.csdn.net/weixin_38779534/article/details/103989320