reactjs - 在 React UseEffect 上同时关闭两个弹出窗口

Question

我有以下代码，并且在主组件中有 2 个弹出窗口。当我按下 ESC 时，我正在从另一个弹出窗口中打开一个弹出窗口，它会关闭其中的 2 个窗口。我怎样才能只关闭一个组件而其他组件仍然打开？

注意：isOpen 是布尔类型并打开弹出窗口

function escHandler (event: KeyboardEvent) {
   if (event.key === 'Escape') closePopup()
}

useEffect(() => {
   //
   // Escape key handling
   //
   if(isOpen && closePopupByClickingOutside) window.addEventListener('keydown', escHandler)

   return () => {
      window.removeEventListener('keydown', escHandler)
   }
}, [ isOpen ])

关闭弹出

export interface OpenClosePopupProps {
    isOpen: boolean;
    closePopup: () => void;
}

<div className="close-popup" onClick={() => closePopup()}></div>

标签： reactjsreact-hooksuse-effect