ElementUI 将table多选框改为单选框

在ElementUI的Table组件中，要将多选框改为单选框，可以使用radio类型的selection-type属性。以下是一个简单的示例代码：

<template>
  <el-table
    :data="tableData"
    style="width: 100%"
    highlight-current-row
    @current-change="handleCurrentChange"
    row-key="id"
  >
    <el-table-column
      type="radio"
      width="55">
    </el-table-column>
    <el-table-column
      prop="date"
      label="日期"
      width="180">
    </el-table-column>
    <el-table-column
      prop="name"
      label="姓名"
      width="180">
    </el-table-column>
    <!-- 其他列 -->
  </el-table>
</template>
 
<script>
export default {
  data() {
    return {
      tableData: [{ id: 1, date: '2016-05-02', name: '王小虎', ... }, ...], // 数据源
      currentRow: null, // 当前选中行
    };
  },
  methods: {
    handleCurrentChange(val) {
      this.currentRow = val;
    },
  },
};
</script>

在这个例子中，我们使用了el-table-column的type="radio"属性来定义单选框列。highlight-current-row属性用于高亮显示当前选中的行，@current-change事件用于监听当前行的变化。row-key属性用于指定唯一键的字段名，通常是id或者其他唯一标识。

注意：在真实的应用场景中，你可能需要管理所选单选框的状态，并在必要时更新tableData中的数据以反映选中状态。上述代码片段只是展示了如何在ElementUI的Table组件中添加单选框列，并能够响应行的选中事件。