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);
};
相关推荐
红尘散仙3 小时前
谁说终端只能敲键盘?我用 Rust 给小说阅读器加上了鼠标
前端·后端·rust
Penge6663 小时前
《Go 后端开发者学 React:组件通信与插槽》
javascript
陈随易4 小时前
C++26 草案被否,二十八年来头一回
前端·后端·程序员
ZhengEnCi4 小时前
Agent 工具怎么折叠海量输出才「爽」:Trae、Claude Code 的渐进式披露设计原理
前端·agent
Penge6665 小时前
《Go 后端开发者学 React:useState》
javascript
Penge6665 小时前
《Go 后端开发者学 React:数据渲染》
javascript
IT_陈寒8 小时前
Redis内存暴涨,没想到是AOF重写捣的鬼
前端·人工智能·后端
ikoala8 小时前
让 Codex 自己查账:一个省 token 的小技巧
前端·后端·ai编程
ikoala8 小时前
AI 写页面像说明书,修 Bug 像贴膏药?把这两句话写进 AGENTS.md
前端·javascript·ai编程
Penge6668 小时前
《Go 后端开发者学 TypeScript:ES Module了解》
javascript