欢迎您访问程序员文章站本站旨在为大家提供分享程序员计算机编程知识!
您现在的位置是: 首页

elementui表格中实现点击单个单元格触发事件

程序员文章站 2022-06-08 15:37:52
...

需求是这样得:表格中循环遍历出值,然后点击单个单元格触发事件。

在官方文档中得事件cell-click,在点击每一行得时候都会触发,显然这不符合要求。

解决方法如下:
在你所需要点击触发事件得单元格中添加如下代码

            <el-table-column prop="name" label="姓名"  >
              <template scope="scope">
                      <div class="sub-body" @click="rePeoplemessageCard(scope.row)">{{ scope.row.name }}</div>
                    </template>
              </el-table-column>

js代码如下

      rePeoplemessageCard(val) {
        // console.log(val,"PeopleId")
      },

直接用就是了,需要在事件中触发啥就写入即可

这样就实现了点。击单个单元格触发事件

在这里顺便记录一下使用cell-click,的用法。

<el-table width="100%" border :data="Datalist" @cell-click="handle" >

methods: {
	handle(row,column,event,cell) {
	    console.log(row)
	    console.log(column)
	    console.log(event)
	    console.log(cell)
    }
}

相关标签: vue elementui