I'm making a game in ReactJS where I'm using a long press event to perform certain actions in the game (using react-click-n-hold for long press events). When I do these actions on a mobile browser, it always brings up the context menu. How can I disable the context menu on mobile without disabling my click and long press events?

I'm making a game in ReactJS where I'm using a long press event to perform certain actions in the game (using react-click-n-hold for long press events). When I do these actions on a mobile browser, it always brings up the context menu. How can I disable the context menu on mobile without disabling my click and long press events?

• javascript
• reactjs
• mobile
• contextmenu

2 Answers 2

<div onContextMenu={(e)=> e.preventDefault()}... />

This solution from Max Svid worked for me

https://stackoverflow./a/56328162/12722618

Kinda late to the topic I found the holdToDisplay flag of the ContextMenuTrigger element reading the API.
Basically, if you set the flag to -1, the trigger is disabled if you hold the click (set to 1000ms by default).

<ContextMenuTrigger id='menu_id' holdToDisplay={-1}>
  // ...
</ContextMenuTrigger>

Although I admit I haven't tested on mobile browsers.
Hope it helps future readers