el-table 多选框单选

为了将el-table的多选框变为单选，可以按照以下步骤进行操作：

1.在el-table中添加一个selection-change事件，用来监听选中项的变化。

2.在事件处理程序中，判断当前选中的行数是否为1，如果不是，则使用table的clearSelection方法清除所有选中的数据，然后使用table的toggleRowSelection方法选中当前行。

3.为了解决数据回显的问题，需要在选中行时将选中的行数据存储到一个变量中，然后在下一次渲染表格时，将该变量中的数据传递给table的selected-rows属性即可。

下面是一个示例代码，可以将其添加到el-table的模板中：

<template>
  <el-table
    :data="tableData"
    :row-key="row => row.id"
    @selection-change="handleSelectionChange"
    :selected-rows="selectedRows"
    ref="table"
  >
    <el-table-column type="selection" width="55"></el-table-column>
    <el-table-column prop="name" label="姓名"></el-table-column>
    <el-table-column prop="age" label="年龄"></el-table-column>
    <el-table-column prop="address" label="地址"></el-table-column>
  </el-table>
</template>

<script>
export default {
  data() {
    return {
      tableData: [
        { id: 1, name: '张三', age: 18, address: '北京市' },
        { id: 2, name: '李四', age: 20, address: '上海市' },
        { id: 3, name: '王五', age: 22, address: '广州市' },
        { id: 4, name: '赵六', age: 24, address: '深圳市' }
      ],
      selectedRows: []
    }
  },
  methods: {
    handleSelectionChange(val) {
      if (val.length !== 1) {
        this.$refs.table.clearSelection()
        this.$refs.table.toggleRowSelection(val[0])
      } else {
        this.selectedRows = val
      }
    }
  }
}
</script>