el-table在行单击时获取行的index

一、涉及参数及事件

参数说明类型类型说明
row-class-name行的 className 的回调方法,也可以使用字符串为所有行设置一个固定的 className。Function({row, rowIndex})/String
  • row-行数据对象
  • rowIndex-行下标
事件名说明参数参数说明
row-click当某一行被点击时会触发该事件row, column, event
  • row-行数据对象
  • column-列对象(它的property属性可以获取到单元格的属性名称)
  • event-事件对象

二、具体实现

1、el-table中添加 row-class-name,绑定@row-click事件

<template>
<el-table
  id="step1"
  :data="list"
  :row-class-name="tableRowClassName"
  border
  @row-click="handleEdit"
>

……
</template>

2、给el-table中的每个row对象里添加index属性

tableRowClassName({ row, rowIndex }) {
    row.index = rowIndex;
},

3、行的点击事件

handleEdit(row, column, event) {
    console.log(row,row.index)
}


版权声明:本文为baidu_29679655原创文章,遵循CC 4.0 BY-SA版权协议,转载请附上原文出处链接和本声明。