問題
在我的個人網站中，需要綁定 / 鍵作為打開和關閉文章目錄的快捷鍵，
最簡單的方法是在 useEffect 中添加 window.addEventListener("keypress", listener)，
然后判斷一下 e.key === "/"，再用 React 中的 useState 控制一個變量來開啟和關閉目錄。
const [open, setOpen] = useState(false)
useEffect(() => {
const listener = (e: KeyboardEvent) => {
if (e.key === "/") {
e.preventDefault()
setOpen(!open)
}
}
window.addEventListener("keypress", listener)
return () => window.removeEventListener("keypress", listener)
}, [])
原來的代碼是這樣的，但是實際測試遇到了 setOpen(!open) 這句不生效的問題。
解決
把 setOpen(!open) 改為 setOpen(open => !open) 這樣就可以了。
原因可能是閉包，導致了 open 獲取的是原來的值。