elementui table 添加单选按钮

你可以使用 ElementUI 的 `<el-table-column>` 组件来添加单选按钮。下面是一个例子：

<template>
  <div>
    <el-table :data="tableData" style="width: 100%">
      <el-table-column type="selection"></el-table-column>
      <el-table-column prop="name" label="Name"></el-table-column>
      <el-table-column prop="age" label="Age"></el-table-column>
      <el-table-column prop="address" label="Address"></el-table-column>
    </el-table>
  </div>
</template>

<script>
export default {
  data() {
    return {
      tableData: [
        { name: 'John', age: 18, address: '123 Main St' },
        { name: 'James', age: 22, address: '456 Elm St' },
        { name: 'Jane', age: 30, address: '789 Oak St' }
      ]
    }
  }
}
</script>

在上面的代码中，我们使用了 `<el-table-column>` 组件的 `type="selection"` 属性来添加单选按钮。这将在表格的左侧添加一个列，其中包含单选按钮。当用户单击单选按钮时，该行将被选中。

你可以通过在 `v-model` 绑定中指定一个变量来跟踪用户选择的行，如下所示：

<template>
  <div>
    <el-table :data="tableData" v-model="selectedRows" style="width: 100%">
      <el-table-column type="selection"></el-table-column>
      <el-table-column prop="name" label="Name"></el-table-column>
      <el-table-column prop="age" label="Age"></el-table-column>
      <el-table-column prop="address" label="Address"></el-table-column>
    </el-table>
  </div>
</template>

<script>
export default {
  data() {
    return {
      tableData: [
        { name: 'John', age: 18, address: '123 Main St' },
        { name: 'James', age: 22, address: '456 Elm St' },
        { name: 'Jane', age: 30, address: '789 Oak St' }
      ],
      selectedRows: []
    }
  }
}
</script>

在上面的代码中，我们使用了 `v-model="selectedRows"` 来绑定用户选择的行。当用户选择行时，`selectedRows` 变量将包含一个对象数组，其中每个对象表示一个选中的行，并包含该行的数据。