我正在编写一个Dialog组件的代码，它可以通过按键盘上的Esc键来关闭，工作正常.
我遇到的问题是，当使用多个对话框相互重叠时，当我按Esc时，它们都会关闭，而我只想逐个关闭顶部的对话框.
重点是知道对话框isOnTop或isNotOnTop和阻止键盘事件.我曾try 使用props 钻孔来判断DialogB是否打开，然后是DialogA isNotOnTop，并防止关闭，但对于更复杂的组件，这种方法似乎很困难.
谁能给我一些建议，如何更好地实施我的 idea ？我是reactjs的新手，谢谢.
这个 idea 看起来是这样的:youtube
下面的代码写在codesanbox上.
我玩了一会儿.我用zustand.js来存储所有打开的对话框.
edit:
(回答您的 comments )
这是因为现在代码根据集合的大小判断标识符.要修复或更换此行
if (dialogs.size === identifier && event.keyCode === escapeKeyNumber) {
具有
if ([...dialogs].pop() === identifier && event.keyCode === escapeKeyNumber) {
this compares the last entry of the set 具有 the identifier instead of the size of the set.
修改sandbox