vue3阻止事件捕获

在 Vue 3 中，阻止事件捕获可以通过使用事件修饰符 `.stop` 来实现。事件修饰符是在事件绑定时使用的特殊语法，用于修改事件的行为。

例如，如果你想要阻止事件在捕获阶段触发，可以在事件绑定中使用 `.stop` 修饰符。下面是一个示例：

<template>
  <div>
    <div @click.capture="handleCapture">Capture</div>
    <div @click.stop="handleClick">Click</div>
  </div>
</template>

<script>
export default {
  methods: {
    handleCapture() {
      console.log('Capture event');
    },
    handleClick() {
      console.log('Click event');
    }
  }
}
</script>

在上面的代码中，`.stop` 修饰符被用于 `@click` 事件绑定中的 `Click` div 上。这样一来，点击该元素时，事件将会被立即停止传播，不再触发父元素的事件处理。

需要注意的是，`.stop` 修饰符只能阻止事件在当前元素上的传播，不会影响其他元素的事件传播。如果你需要完全阻止事件传播，可以考虑使用 `.prevent` 修饰符或调用 `event.stopPropagation()` 方法。