如何解决右键单击 Reactjs 中选定区域的自定义上下文菜单
这里我试图在用户右键单击受尊重的 div
时显示简单的上下文菜单,如果他单击除此 div 之外的其他内容,则它会显示浏览器默认上下文菜单。我看过一些文章,但它们显示在孔屏幕上。谁能知道我们如何实现这一目标?任何帮助将不胜感激。
这是我尝试过的。
class CustomContextMenu extends Component {
componentDidMount() {
document.addEventListener("click",this.handleClick);
document.addEventListener("contextmenu",this.handleContextMenu);
}
componentWillUnmount() {
document.removeEventListener("click",this.handleClick);
document.removeEventListener("contextmenu",this.handleContextMenu);
}
handleClick = (e) => {
// ...
}
handleContextMenu = (e) => {
e.preventDefault();
// ...
}
render() {
<div>
<div>
// some stuff will be here... and in this area browser default context menu can open here..
</div>
<div id="my-menu">
//on right click my custom context menu will open here...
// if menu is open and user click here then menu should close or hide
</div>
<ul className="my-menu" style={{top: yPos,left: xPos}} >
<li>add</li>
<li>delete</li>
<li>update</li>
</ul>
</div>
}
}
版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。