react中dom监听方法内值不更新

今天工作有个需求是，键盘按上下键的时候切换显示的内容。
这样就用到了原生js中对的addEventListener方法来监听操作，也遇到了一个奇怪的问题，在addEventListener监听方法时，获取的值都是最初的值，没有改变。
经过疯狂百度后发现是因为addEventListener里面形成闭包了，所以什么值都不更新。

原始写法

useEffect(() => {
    window.addEventListener('keydown', keyChange)
 }, [])

改变后写法

useEffect(() => {
    window.addEventListener('keydown', keyChange)
    return () => {
      window.removeEventListener("keydown", keyChange);
    }
  }, [list.length])  

使用useEffect去监听值的改变，并及时的移除EventListener，这样拿到的值就是改变后的了～