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);
};
相关推荐
NiNg_1_23421 分钟前
vue中的vuex详解
前端·vue.js
赵广陆1 小时前
SSM+Vue社区物业管理系统
java·前端·javascript·vue.js·maven
懒洋洋大魔王1 小时前
7.Javaweb-Ajax
前端·ajax·okhttp
Vesper632 小时前
【js】Node.js的fs的使用方法
前端
前端开发菜鸟的自我修养2 小时前
elementUi / elementPlus自定义上传方法 Upload自定义文件上传
前端·javascript·vue.js·阿里云·elementui·七牛云存储
勿语&2 小时前
多级侧边菜单(递归)
前端·javascript·vue.js
什么鬼昵称2 小时前
Pikachu-Cross-Site Scripting-DOM型xss
前端·javascript·xss
码狂☆3 小时前
markdown 中启用音频支持
开发语言·javascript
盏灯3 小时前
🎨🎨🎨国庆来唠唠,前端非常实用的监听API - Intersection Observer
前端