a-table列点击事件
时间: 2024-10-17 10:02:12 浏览: 35
在Ant Design Vue (a-table)组件中,列点击事件通常通过`cell-click`属性来设置。这个属性是一个函数,当用户点击指定列单元格时会被触发。你可以在这个函数中获取到被点击行的数据以及列的信息。
例如:
```html
<template>
<a-table :data="tableData" cell-click="handleCellClick">
<!-- ... -->
<a-table-column title="操作" prop="action" clickable>
<!-- ... -->
</a-table-column>
</a-table>
</template>
<script>
export default {
methods: {
handleCellClick({ row, column, event }) {
console.log('点击了第', row.index, '行的', column.title, '列');
// 在这里可以根据row和column处理业务逻辑
},
},
data() {
return {
tableData: [
// ...
],
};
},
};
</script>
```
在这个例子中,当你点击表格中的“操作”列时,`handleCellClick`方法会被调用,你可以通过`row`获取当前行数据,`column`获取当前列信息,`event`则包含了原生的DOM点击事件。
阅读全文