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);
};
相关推荐
团团崽_七分甜18 分钟前
Spring Data JPA 从入门到实战完整指南
前端
我是大卫33 分钟前
React源码解析-第一部分:宏观架构
前端·react.js·源码
我是大卫39 分钟前
React源码解析-第二部分:更新与调度
前端·react.js·源码
狸礼li43 分钟前
web网站设计作品--第二大脑
前端
2603_955279701 小时前
C++23新特性在CLion中的实战体验
前端·javascript·c++23
梨子同志1 小时前
HTTP
前端
kidding7231 小时前
旋转大转盘小程序
前端·css·微信小程序·小程序·前端框架
道友可好1 小时前
Claude Code 泄露源码里的 89 个秘密
前端·人工智能·后端
Tian_Hang1 小时前
Eclipse Ditto 的权限策略
java·服务器·前端·网络·ide·ubuntu·eclipse
叩码以求索1 小时前
经典算法实例分析:写字符串需要的行数
开发语言·javascript·ecmascript