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);
};
相关推荐
Hilaku13 小时前
多标签页并发请求导致 Token 刷新失败?只有 15行代码就能解决 !
前端·javascript·程序员
烛衔溟13 小时前
TypeScript 类的静态成员与静态方法
开发语言·javascript·typescript
Nile13 小时前
解密Palantir系列一:4. Ontology 不是哲学
开发语言·前端·javascript
Highcharts13 小时前
如何创建蛛网地图|气泡事件+全球发布+关联组合图表开发示例
javascript
因_崔斯汀14 小时前
ECharts 区域地图可视化实战:以山东地图为例
前端
Bacon14 小时前
手摸手带你搞清楚 AI Agent 的六大核心概念
前端·人工智能
xier12345614 小时前
three-instance-batch 开发笔记
javascript·three.js
王林不想说话14 小时前
TypeScript 进阶知识总结:从 extends、泛型到 infer,一篇打通 TS 类型系统
前端·javascript·typescript
卤蛋fg614 小时前
vxe-table 实现数据分组统计与表尾合计
vue.js
罗超驿14 小时前
15.JavaScript 函数与作用域完全指南:语法、参数、表达式与作用域链实战
开发语言·前端·javascript