我希望能够右键单击关闭Menu
(或者更具体地说,关闭Popover
(,清除任何mousedown
事件。
我在文档中发现了这一点:https://material-ui.com/components/menus/#MenuListComposition.js
然后我把它清洗了一点。以下是我得到的:https://codesandbox.io/s/material-ui-react-8nqqb?fontsize=14&隐藏导航=1&主题=深色
如果你检查它,你可以看到Popper
在右键单击时关闭,但现在我可以在菜单打开时滚动页面:/
这几乎是我所需要的,但我无法对Popover
做同样的事情,因为它在内部使用Modal
,而且他们似乎要么不使用ClickAwayListener
,要么没有公开修改其道具的方法。
因此,如果有人知道如何使mousedown
事件关闭Popover
或在Popper
打开时阻止滚动,我将非常乐意听到任何解决方案。
提前谢谢。
编辑:
多亏了这个答案,我找到了方向,我调整了给定的沙盒,我成功地做了我想做的事。我最后不得不使用Popper
,并在它打开时阻止滚动。
这是最后一个沙盒链接:https://codesandbox.io/embed/material-ui-react-1qroy?fontsize=14&隐藏导航=1&主题=深色
如果popper打开,这里有一种禁用滚动的方法。
window.onscroll = open ? null : () => window.scrollTo(0, 0);
https://codesandbox.io/s/material-ui-react-zysue
以下是popover而不是popper 的相同示例
https://codesandbox.io/s/material-ui-react-n0bf9