vue.js - 因为需求对Element-UI的el-table进行再次封装，需要获取被点击行的key(或者说index) 十万火急

问题描述

问 题

问题描述

在做一个项目需求的时候，需要用v-for来渲染我的el-table。因此我自己对Element-ui的el-table进行了再次封装。对于table中的每一行我需要点击获取key(或者说是index)根据网上现有的解决方式，以及'不靠谱'的文档，我进行了打印。但是发现一些问题，希望有大牛帮帮忙。

部分代码如下

template的内容

<el-table
   :data="tableData"
   stripe
   style="width: 100%"
   max-height="300"
   id='booklist'
   @row-click='show()' 
>
      <el-table-column
        v-for='(item, key) in labelData'
        :key='key'
        :prop='item.type'
        :label='item.name'
        :width='item.width'
      >
      </el-table-column>
</el-table>

js部分

<script>
export default {
  name: 'booklist',
  props: ['tableData', 'labelData'],
  methods: {
    show() {
      console.log(row);
    }
  }
}
</script>

控制台报错

row未定义

问题总结

我该如何书写才能正确获取到我需要的key(index)或者被点击行的信息

解决方案

1.@row-click='show()'改为@row-click='show'
2.

methods: {
    show() {
      console.log(row);
    }
  }

改为

methods: {
    show(row) {
      console.log(row);
    }
  }

这篇关于vue.js - 因为需求对Element-UI的el-table进行再次封装，需要获取被点击行的key(或者说index) 十万火急的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！