处理一个元素上的不同点击事件

Question

我正在尝试实现一种解决方案，该解决方案允许将3个不同的处理程序附加到一个元素，但是没有一个应触发其他处理程序。

使用https://vuejs.org/v2/guide/events.html作为参考

<div @click.ctrl="methodA" @click="methodB" @contextmenu.ctrl="methodC"></div>

我尝试在每个对象上随机使用.stop修饰符，但是当我单击时，我无法阻止methodA也触发methodB。什么是正确的使用方式/修饰符，或者我附加处理程序的顺序很重要？

编辑

https://codepen.io/anon/pen/JVrGKo

Answer 1

有趣的是，我创建了自己的笔来测试这一点，并且我也可以看到您在问题中描述的同样的事情，但是使用您创建的笔我看不到它的发生。

无论如何，触发@ click.ctrl时触发@click确实有意义。但是您可以通过使用.exact modifier来防止这种情况的发生，因此只有在使用确切的组合时才触发事件。像这样：

<div 
  @click.ctrl="methodA" 
  @click.exact="methodB"
  @contextmenu.ctrl="methodC"
></div>

以this pen为例

让我知道是否可行。