element table 怎么实现单选功能

官网提供的单选是点击行通过高亮实现的选中行,想通过操作框的方式实现,如果table初始就有选中状态怎么实现。
目前实现了单选功能,但是初始选中状态不对。
效果图:
image.png
template:

<el-table

ref="userOutTable"
:data="optionsystemList"
border
@current-change="handleCurrentChange"
<el-table-column label="操作" column-key="id" width="50px" >
  <template slot-scope="scope">
    <el-checkbox v-model="scope.row.checked" />
  </template>
</el-table-column>

</el-table>
js:

handleCurrentChange(row) {

this.optionsystemList.forEach((item) => {
  if (item.id !== row.id) {
    item.checked = false
  } else {
    item.checked = true
  }
})
this.currentRow = row

},

阅读 4.2k
1 个回答

参考:答案
注意:需要给table添加属性 highlight-current-row

撰写回答
你尚未登录,登录后可以
  • 和开发者交流问题的细节
  • 关注并接收问题和回答的更新提醒
  • 参与内容的编辑和改进,让解决方法与时俱进