Here is an example of how you can disable the right click context menu for a specific element in a React component:
import React from 'react';
function MyComponent() {
const handleContextMenu = (event) => {
event.preventDefault();
}
return (
<div onContextMenu={handleContextMenu}>
Right click on this element is disabled.
</div>
);
}
export default MyComponent;
Alternatively, you can also use the contextmenu event in the DOM API to disable the right click context menu for the entire document:
import React, { useEffect } from 'react';
function MyComponent() {
useEffect(() => {
const handleContextMenu = (event) => {
event.preventDefault();
}
document.addEventListener('contextmenu', handleContextMenu);
return () => {
document.removeEventListener('contextmenu', handleContextMenu);
};
}, []);
return (
<div>
Right click is disabled for the entire document.
</div>
);
}
export default MyComponent;