elementUI表格单选，点击行选中一行数据

本文章仅是记录我在项目中遇到的各种单选问题，希望对你会有所帮助，写的不对的地方欢迎在评论区讨论。

1.elementUI 实现表格单选

只需要在表格的 < el-table-column > 中添加一个自定义模板即可：

完整template部分：

javascript部分：

data(){
     
	return{
     
	  // 单选绑定
      radioSelected: null,
      // 表格选中row数据
      multipleSelection: {
     },
	}
},
methods:{
     
    // 点击行选中,绑定数据
    handleSelectionChange(val) {
     
      this.radioSelected = val.name  //选中行的name
      this.multipleSelection = val  //选中的一行数据
    }
}

到这就大功告成了，以下是单选的其他需求，到此止步！！！

2.后台没传id，自己根据表格数组创建id,绑定到列的:index

template部分：

javascript部分：

methods:{
     
    // 表格序号
    getIndex(index) {
     
      return (this.currentPage - 1) * this.pageSize + index + 1
    },
}

3 .单选按钮和索引在同一列,将  ；替换（含表格分页）

由于没有id所以只能自己使用方法 getInde（） 去处理id ，有id 可以直接绑定 row.id。

template部分：