Vue 中你如何捕获元素上的点击事件？

在 Vue 中捕获元素上的点击事件，可以使用 @click 或 v-on 指令来绑定一个点击事件处理函数。这个处理函数可以在 Vue 组件的方法中定义。

<template>
  <button @click="handleClick">Click me</button>
</template>

<script>
export default {
  methods: {
    handleClick() {
      // 处理点击事件的逻辑
      console.log('Button clicked!');
    }
  }
};
</script>

在上面的例子中，@click 指令将 handleClick 方法绑定到了按钮的点击事件上。当按钮被点击时，handleClick 方法就会被调用，从而执行定义在其中的逻辑。

如果要访问事件对象或传递额外的参数，可以像普通的 JavaScript 事件处理函数一样，在方法中接收事件对象 $event 或者传递其他参数：

<template>
  <button @click="handleClick('Hello', $event)">Click me</button>
</template>

<script>
export default {
  methods: {
    handleClick(greeting, event) {
      // 处理点击事件的逻辑，使用传递的参数
      console.log(greeting); // 输出 'Hello'
      console.log(event); // 输出事件对象
    }
  }
};
</script>

这样，你可以在 Vue 中轻松地捕获元素上的点击事件，并执行相应的逻辑。