el-table 事件传默认参数和自定义参数
时间: 2023-10-21 15:10:47 浏览: 167
el-table 是 Element UI 中的一个表格组件,它支持多种事件,包括 cell-click、row-click、sort-change、filter-change 等等,这些事件都会传递一些默认参数和自定义参数。
对于默认参数,el-table 会传递以下几个参数:
- row:当前被点击、排序、筛选的行数据。
- column:当前被点击、排序、筛选的列数据。
- cell:当前被点击的单元格数据。
- event:当前触发的事件对象。
对于自定义参数,可以通过在模板中使用 v-on 指令来传递,例如:
```html
<el-table @row-click="handleRowClick">
<el-table-column prop="name" label="姓名"></el-table-column>
<el-table-column prop="age" label="年龄"></el-table-column>
<el-table-column prop="address" label="地址"></el-table-column>
</el-table>
```
在这个例子中,我们监听了 row-click 事件,并指定了 handleRowClick 方法来处理事件,可以在方法中通过 $event 参数来获取自定义参数,例如:
```js
methods: {
handleRowClick(row, column, event) {
console.log(row.name, event.target.innerText)
}
}
```
在这个例子中,我们通过 event.target.innerText 来获取点击的单元格内容。
阅读全文