如何在不显示典型浏览器上下文菜单的情况下处理 Blazor（客户端/WASM）中的右键单击事件？

Question

HandleClick 似乎只处理左键单击，但看起来我可以使用onmouseup和MouseEventArgs.Button属性来检测右键单击。
问题是出现了典型的浏览器提供的上下文菜单。有没有办法防止这种情况？我在 Blazor 中没有看到类似 preventDefault() 的内容。

更新：显然我们可以做，@onmouseup:preventDefault但上下文菜单仍然显示

Answer 1

好的，我想通了：

<div oncontextmenu="return false;" @onclick="HandleClick" @onmouseup="HandleMouseUp" >
    this is a div
</div>
@code {

    void HandleClick(MouseEventArgs args)
    {
        Console.WriteLine("This is a left click");
    }

    void HandleMouseUp(MouseEventArgs args)
    {
        if (args.Button == 2)
            Console.WriteLine("This is a right click");
    }
}

关键是oncontextmenu="return false;"div 本身中的javascript。

Answer 2

感谢您提供的信息，它对我帮助很大

对于任何使用此功能的人来说，只是一个提示，我使用带有菜单项标签的 div 制作了自己的上下文菜单组件，并且发现默认上下文菜单仍然偶尔会在双击鼠标右键或按住鼠标时出现鼠标右键停留时间过长。事实证明，右键单击是在我的菜单组件上发生的，然后显示了默认菜单，因为它显示在当前鼠标位置上。所以添加 oncontextmenu="return false;" 我的菜单组件也需要完全停止它。

只是分享，因为我花了太长时间才弄清楚为什么它仍然出现

Answer 3

您可以使用@oncontextmenu在blazor直接。结合@oncontextmenu:preventDefault="true"它不会显示上下文菜单。

<div @onclick="HandleClick" @oncontextmenu="HandleRightClick" @oncontextmenu:preventDefault="true" >
    this is a div
</div>

@code {

    void HandleClick(MouseEventArgs args)
    {
        Console.WriteLine("This is a left click");
    }

    void HandleRightClick(MouseEventArgs args)
    {
        if (args.Button == 2)
            Console.WriteLine("This is a right click");
    }
}