如何在ReactJS中禁用画布中的右键单击。以下是我尝试过但仍然不起作用的方法:
let Canvas = <canvas onContextMenu={(e)=> {e.preventDefault(); return false;}} height={500} width={500} ref="canvas"/>;
浏览器控制台中也会显示警告。
警告:不建议从事件处理程序返回false
,并且将在未来的版本中被忽略。相反,请手动调用e.stopProjuation()或e.preventDefault()。
编辑:是的,它确实停止了画布上的右键单击功能,但我的问题是:我在左键单击时绘制了一个点,它也在右键单击时绘制,我想禁用它。
此JS函数将防止contextmenu事件冒泡,从而防止出现上下文菜单:
canvas.oncontextmenu = function (e) {
e.preventDefault();
};
您可以通过忽略右键来阻止右键单击实际执行任何操作,如下所示:
handleMouseDown = e => {
if (e.button === 0)
{
// Actions to perform when left mouse button is clicked, like update state
}
}
let Canvas = <canvas onMouseDown={this.handleMouseDown} ...>;