VueJS中的右键单击和右键单击事件

Question

我正在使用vue 2.1.10。

我正在使用@contextmenu事件来检测右键单击事件。

但我想检测右键单击向上和向下事件。

我该怎么做？

Answer 1

随着V2.2的，你可以听使用right modifier鼠标右键单击事件（和防止contextmenu事件的默认行为，通过使用prevent modifier）：

<button 
    @mousedown.right="mousedown" 
    @mouseup.right="mouseup" 
    @contextmenu.prevent 
> 
    Click Me 
</button> 

Here's a working fiddle.

---

如果您未使用v2.2或更高版本，则可以使用单击事件的which属性来手动检查鼠标右键单击：

<button 
    @mousedown="mousedown" 
    @mouseup="mouseup" 
    @contextmenu.prevent 
> 
    Click Me 
</button> 

methods: { 
    mousedown(event) { 
    if (event.which === 3) { 
     console.log("Right mouse down");   
    } 
    }, 
    mouseup(event) { 
    if (event.which === 3) { 
     console.log("Right mouse up"); 
    } 
    } 
} 

Here's a working fiddle.