el-table的行点击row-click事件获取行索引

1,el-table的行点击row-click事件获取行索引

<el-table :row-class-name="tableRowClassName" @row-click="rowClick"></el-table>

2,给每一行row的数据对象里添加index属性

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

3,监听行的点击事件

rowClick(row) {
    console.log(row);  // 当前点击的行数据
    console.log(row.index);   // 当前点击的行的索引值
}

4,row-click表格单行点击和单元格事件冲突解决/冒泡解决:
元素添加@click.stop 或 @click.native.stop

<el-table :row-class-name="tableRowClassName" @row-click="rowClick">
    <el-table-column>
        <el-input @click.native.stop v-model="input" placeholder="请输入内容"/>
    </el-table-column>
</el-table>
最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容