Javascript 只有当我按下输入中的键时，React event onKeyDown才会起作用

我试图让一个事件监听器在Escape键上退出一个菜单，但它只在我在输入中按下该键时起作用。这是我的职责：

<div onKeyDown={(e) => {
        if(slidingMenu[0] === 'd-block' && e.key === 'Escape') {
            toggleEditMenu()
        }
    }} className={`shadow ${slidingMenu[0]}`}>

{
如果（滑动菜单[0]=='d-block'和&e.key=='Escape'）{
toggleEditMenu（）
}
}}className={`shadow${slidingMenu[0]}`}>

此div是我试图关闭的菜单的父级

---

toggleEditMenu（）只是一个将div类更改为d-none的函数

焦点必须位于元素内才能触发此事件。最好的方法是将keydown事件绑定到文档本身。你可以试一下

useEffect(() => {
    window.addEventListener('keydown', handlerFunction);
    // return cleanup funtion to remove the handler after use
    return () => {
        window.removeEventListener('keydown', handlerFunction);
    } 
}, []);

---

焦点必须位于元素内，才能触发此事件。最好的方法是将keydown事件绑定到

文档本身？我的意思是，我可以用普通的JavaScript来实现，但是我想知道是否有一种方法可以对文档本身处理该事件，谢谢！