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);
};
相关推荐
Hilaku6 分钟前
一行 CSS 新特性干掉 20 行 JavaScript ?
前端·javascript·程序员
风月说与山鬼12 分钟前
JS闭包详解
开发语言·javascript
JarvanMo20 分钟前
AI 写代码暴增 161 倍,移动开发有没有变得更差?
前端
梦曦i25 分钟前
RouterLink v2.5.0:H5端原生能力全面回归
前端·uni-app
小林ixn39 分钟前
React + Zustand + JWT:从零实现登录鉴权与请求拦截
前端·react.js·前端框架
葡萄城技术团队43 分钟前
下拉多选类型单元格:在 SpreadJS 里接入 xm\-select
前端
粥里有勺糖1 小时前
视野修炼-技术周刊第130期 | 光影效果
前端·javascript·github
小岛前端1 小时前
AI Skills 已经封神,但新的问题却越来越严重!
前端·后端·github
拖孩1 小时前
一个人 + AI 做的小程序,上线 15 天赚了 10 块 5
前端·后端·微信小程序
用户93983829415991 小时前
安卓自动化脚本热更新怎么做?不重新打包 APK 也能更新代码
前端