作者:书友78403557 | 来源:互联网 | 2022-06-17 19:24
elementui中提供了点击行处理事件
查看位置: elementui的table事件
elementui的table中怎样点击某个单元格触发事件?
可以先看一下官网中table的自定义列模板代码
{{ scope.row.date }}
姓名: {{ scope.row.name }}
住址: {{ scope.row.address }}
{{ scope.row.name }}
编辑
删除
点击单元格弹出框可以使用template-scope方式实现
父组件
{{ scope.row.date }}
{{ scope.row.date }}
子组件 mycomponent
问题解决
可以使用template+slot插值进行管理
点击找到当前行的信息,然后再根据该信息在子组件中请求数据
也试过通过点击行的事件,判断在哪一个单元格然后处理事件,这样也可以,但如果在表格中列存放的内容发生变化又得重新调整
也试过dialog弹出框直接写在当前单元格的template中,就像官网中例子一样,但是这样会在点击时触发多次(次数与当前页展示的数量一致)
补充知识:element cell-click使用方法
我就废话不多说了,大家还是直接看代码吧~
methods: {
handle(row,column,event,cell) {
console.log(row)
console.log(column)
console.log(event)
console.log(cell)
}
}
以上这篇vue+elementui实现点击table中的单元格触发事件--弹框就是小编分享给大家的全部内容了,希望能给大家一个参考,也希望大家多多支持。