vue ts监听点击的单元格
时间: 2023-10-14 11:15:44 浏览: 35
如果您使用的是Vue TypeScript,可以使用以下代码来监听单元格的点击事件:
```typescript
<template>
<table>
<tbody>
<tr v-for="(row, rowIndex) in data" :key="rowIndex">
<td v-for="(cell, cellIndex) in row" :key="cellIndex"
@click="handleCellClick(rowIndex, cellIndex)">
{{ cell }}
</td>
</tr>
</tbody>
</table>
</template>
<script lang="ts">
import { Vue, Component } from 'vue-property-decorator';
@Component
export default class MyComponent extends Vue {
data = [
[1, 2, 3],
[4, 5, 6],
[7, 8, 9],
];
handleCellClick(rowIndex: number, cellIndex: number) {
console.log(`Clicked on cell (${rowIndex}, ${cellIndex})`);
}
}
</script>
```
在上面的代码中,我们在`<td>`元素上使用`@click`指令来监听单元格的点击事件,并将`rowIndex`和`cellIndex`作为参数传递给`handleCellClick`方法。在`handleCellClick`方法中,我们可以执行任何我们想要的操作。