el-table表格点击该行任意位置时也勾选上其前面的复选框

需求:当双击表格某一行任意位置时,自动勾选上其前面的复选框

1、在el-table 组件的每一行添加@row-dblclick事件,用于双击点击

复制代码
  <el-table
        :data="tableData"
        ref="tableRef"
 @selection-change="handleSelectionChange"
        @row-dblclick="handleRowClick"
      >
<el-table-column type="selection" fixed width="55" align="center" />
        <el-table-column
          type="index"
          fixed
          label="序号"
          width="75"
          align="center"
        />
</el-table>

2、定义方法在 `handleRowClick` 方法中,通过修改 `row` 对象中的某个属性来标记该行是否被选中,调用 `toggleRowSelection` 方法来切换多选框的勾选状态。

const sourceRef = ref();

复制代码
//双击
const handleRowClick = (row) => {
  console.log(row, "双击--");
  row.isSelected = !row.isSelected;
  tableRef.value.toggleRowSelection(row);
};
相关推荐
掘金者阿豪1 分钟前
Codex 怎么突然变慢了?一个需求跑几十分钟,我才发现它的工作方式已经变了
前端·后端
用户931456355667 分钟前
从 3 秒到 300 毫秒:一次真实的前端首屏性能优化全记录
前端
whn19778 分钟前
dm9安装初体验
前端
阿黎梨梨14 分钟前
从零搞懂 JWT 登录鉴权:一张“电子通行证”的诞生记
前端
全栈项目管理程序猿14 分钟前
ArcGIS JS 基础教程(12):视图截图 takeScreenshot
javascript
用户9210802628614 分钟前
ChatMessageList 消息列表组件:基于 BubbleList 搭建 AI 对话展示区
前端
HjhIron18 分钟前
实战 React + JWT + Zustand:从零搭建登录鉴权系统
前端
小棉花的ai跨境之旅19 分钟前
Codex 子 Agent 分工实战:Sol 当军师、Luna 当搬砖工,单任务成本压到 $0.61
javascript
晴天1639 分钟前
DeepSeek Harness 全景技术解析-Day23
前端·deepseek
风月说与山鬼1 小时前
三、uni-app页面配置(pages.json)
前端·uni-app