el-table 带radio 两列

`el-table` 是 Element UI 中的一个表格组件，它可以非常方便地处理数据列表并提供丰富的交互功能。如果你想要在 `el-table` 中添加带有单选功能的两列，你可以这样做：

首先，你需要安装 Element UI 并在项目中引入 `el-table` 组件。确保你在模板中正确使用了该组件。

1. 安装 Element UI：

   npm install element-ui -S

2. 引入组件和样式：

   <template>
     <div>
       <el-container>
         <el-header>...</el-header>
         <el-main>
           <el-table :data="tableData" style="width: 100%">
             <!-- 以下代码表示表头 -->
             <el-table-column type="index" label="序号"></el-table-column>
             <el-table-column prop="name" label="姓名" width="180">
               <!-- 添加 radio 列 -->
               <template slot-scope="{ $index, row }">
                 <el-radio v-model="selectedRowKeys[$index]" @change="handleRadioChange(row)">
                   {{ row.name }}
                 </el-radio>
               </template>
             </el-table-column>
             <!-- 另一列... -->
             <!-- 如果你还有其他列，类似上面的结构添加即可 -->
           </el-table>
         </el-main>
       </el-container>
     </div>
   </template>

3. 数据和方法：

   // 数据部分
   data() {
     return {
       tableData: [
         { name: '张三', value: 'value1' },
         { name: '李四', value: 'value2' },
         // 更多数据...
       ],
       selectedRowKeys: [], // 用于存储被选中的行的索引数组
     };
   },
   
   // 方法部分
   methods: {
     handleRadioChange(row) {
       // 当单选框变化时，更新 selectedRowKeys 或执行其他操作
       this.selectedRowKeys.push(row.$index); // 更新当前行的索引
     }
   }

在这个例子中，我们创建了一个包含两个列的 `el-table`。第一列是标准文本列，第二列使用了 `el-radio` 组件，当用户选择某一行时，对应的索引会被推入 `selectedRowKeys` 数组。记得在 `handleRadioChange` 方法里根据实际需求进行相应的逻辑处理。