vue3之el-table单选

el-table文档中没有表格数据单选,因此基于复选框实现数据单选限制。

主要实现代码

bash 复制代码
<el-table :data="tableList" ref="tableRef" @select="selectClick">
	...
</table>

// method
const selectClick = (selection) => {
  let selectRow = {};
  if (selection.length > 1) {
    let del_row = selection.shift(); // 删除选中的第一项
    tableRef.value.toggleRowSelection(del_row, false); //并改变table勾选状态
  }

  // 到这selection数据始终为1条
  if (selection.length) {
    selectRow = selection[0];
  }
  emit("getRow", selectRow);
};
相关推荐
IT_陈寒24 分钟前
为什么你应该学习JavaScript?
前端·人工智能·后端
大龄秃头程序员30 分钟前
iOS冷启动监控Demo
前端
光影少年34 分钟前
为什么 JavaScript 中 0.1 + 0.2 !== 0.3,如何让其相等?
前端·javascript·算法
掘金酱1 小时前
[稀土掘金 × 火山引擎] AI用量周榜冲刺赛|获奖名单公示
前端·人工智能·后端
泡泡oO1 小时前
“如果你还在用Superpowers,那我不要和你说话”
前端·后端·全栈
维克兜率天1 小时前
趋势过滤:避免被“假突破“反复打脸
前端
8年区块链老兵2 小时前
一篇文章教会你:用区块高度读懂比特币链上的每一笔交易
前端
xixichensh2 小时前
前端转做AI程序员第一步——开发一个AI流式对话Demo
前端
梓雨枔2 小时前
JavaScript+快速学习,简单好用~
javascript·学习
木易 士心2 小时前
JavaScript 闭包原理和实践深度解析
开发语言·javascript·ecmascript