Material-UI - 有没有办法允许右键单击关闭模态？

Question

我希望能够通过右键单击关闭Menu（或者更具体地说，Popover），任何mousedown 事件要清楚。

我在文档中找到了这个：https://material-ui.com/components/menus/#MenuListComposition.js

然后我清理了一下。这是我所拥有的：https://codesandbox.io/s/material-ui-react-8nqqb?fontsize=14&hidenavigation=1&theme=dark

如果您检查它，您可以看到Popper 在右键单击时关闭，但现在我可以在菜单打开时滚动页面：/

这几乎是我需要的，但我无法对 Popover 做同样的事情，因为它在内部使用 Modal，而且似乎他们不使用 ClickAwayListener 或者他们不公开修改其道具的方法。

因此，如果有人知道如何使 mousedown 事件关闭 Popover 或在 Popper 打开时阻止滚动，我将非常乐意听到任何解决方案。

提前致谢。

编辑：

感谢this answer，我得到了一个方向，我调整了给定的沙箱，并设法做我想做的事。我终于不得不使用Popper 并在它打开时阻止滚动。

这是最终的沙盒链接：https://codesandbox.io/embed/material-ui-react-1qroy?fontsize=14&hidenavigation=1&theme=dark

Answer 1

这是一种在弹出器打开时禁用滚动的方法。

    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