Vue 3 - 防止事件在自定义事件处理程序上传播

Vue 3 - Prevent event propagation on custom event handlers

提问人:Triggsy 提问时间:1/23/2023 更新时间:1/23/2023 访问量:457

问:

如果我有一个像 @my-event 这样的自定义事件处理程序,并且我用

this.$emit('my-event')

它从所有父组件调用@my事件的所有事件。 但我想防止这种情况发生。 在像 @click 这样的普通事件处理程序上,我们可以简单地在它后面添加 .stop 来防止这种行为。 但是 .stop 不适用于自定义事件侦听器。

不停地小提琴:https://jsfiddle.net/xn9sq4cp/

摆弄停止:https://jsfiddle.net/xy18mspz/

我知道我可以添加

inheritAttrs: false

为了防止事件传播全局,但我不希望这样。

那么,如何防止自定义事件处理程序的事件传播。

谢谢。

vue.js 事件 侦听器 处理程序 传播

评论


答:

1赞 Mkalo 1/23/2023 #1

您可以通过添加以下内容来阻止组件发出事件以阻止其冒泡:

// ...
emits: {
  'my-event': false
}
// ...

JS小提琴