vue3实现el-table表格单选功能以及默认选中某一行数据

要实现效果如下:

实现思路如下:

1.使用elemplent-plus组件的el-table组件实现。
2.使用select方法和select-all方法进行数据绑定方法。
3.使用toggleRowSelection方法进行校验数据默认选中以及切换某一行的状态。(详细见Table 表格 | Element Plus (element-plus.org)

具体代码截图如下:

1.el-table组件
2.select方法和select-all方法
3.点击编辑按钮找到某个id相同的数据,默认选中那行数据

这样就ok了,效果实现了!!!有神马不懂的可以评论区或者私信我哦

相关推荐
请叫我聪明鸭12 小时前
基于 marked.js 的扩展机制,创建一个自定义的块级容器扩展,让内容渲染为<div>标签而非默认的<p>标签
开发语言·前端·javascript·vue.js·ecmascript·marked·marked.js插件
悟能不能悟12 小时前
Gson bean getxxx,怎么才能返回给前端
java·前端
2501_9447114312 小时前
前端向架构突围系列 - 工程化(五):企业级脚手架的设计与落地
前端·架构
Apex Predator12 小时前
本地库导入到nexus
java·服务器·前端
趁着年轻吃点苦12 小时前
宝塔面板部署指南
前端
0思必得012 小时前
[Web自动化] Selenium中Select元素操作方法
前端·python·selenium·自动化·html
一叶星殇13 小时前
C# .NET 如何解决跨域(CORS)
开发语言·前端·c#·.net
RunsenLIu13 小时前
基于Spring Boot + Vue的图书馆座位预约管理系统
vue.js·spring boot·后端
运筹vivo@13 小时前
攻防世界: catcat-new
前端·web安全·php
阿雄不会写代码13 小时前
Let‘s Encrypt HTTPS 证书配置指南
前端·chrome