Reactjs '；事件'；不可分配给类型为'；WheelEvent<；元素>'；

我正在尝试找出窗口滚动侦听器上事件的正确类型，我找不到任何参考来修复此错误，我看到人们只分配类型

any

const handleNavigation = (e: React.WheelEvent) => {
  if (e.deltaY > 0) {
    console.log('scrolling down')
  } else if (e.deltaY < 0) {
    console.log('scrolling up')
  }
}

useEffect(() => {
  window.addEventListener('scroll', e => handleNavigation(e))
  return () => window.removeEventListener('scroll', e => handleNavigation(e))
}, [])

---

DOM Method

窗口。addEventListener

需要一个DOM EventListener

const handleNavigation = (e: Event) => {
   console.log(e.target)
}

问题是，这是为公众服务的，而不是为公众服务的。如果需要

deltaY

，则需要

wheel

事件。如果你使用它，类型就起作用了。下面是一个示例（根据我对问题的评论，箭头函数被删除）：

const handleNavigation=（e:wheeleevent）=>{/***使用DOM的`wheeleevent`类型（而不是`React.wheeleevent`）声明
如果（e.deltaY>0）{
log（“向下滚动”）；
}否则，如果（e.deltaY<0）{
log（“向上滚动”）；
}  
};
useffect（（）=>{
窗口。添加了监视器（“轮子”，手导航）；//***使用“轮子”`
return（）=>window.removeEventListener（“车轮”，手柄导航）；//***使用“车轮”`
}, []);

旁注1：您的

removeEventListener

代码不起作用，因为您没有将传递给它的函数与传递给

addEventListener

的函数相同（因为您将

handleNavigation

包装在每个位置的箭头函数中）。旁注2：您不需要箭头函数，只需

.addEventListener（handleNavigation）

和

.removeventlistener（handleNavigation）

（这很方便地解决了旁注1:-）中的问题）。所有这些都不能解决您所问的类型问题。如果我将

Event

添加为类型，则会出现错误，因为

属性“deltaY”不存在于类型“Event”

我确实让警卫和类型脚本抱怨了所有这些，但我确实在@lvaro设置了一个非常严格的类型脚本-不，我错了。一秒。：-）@阿尔瓦罗-修好了。很抱歉。我真的应该相信你。：-）谢谢你，这简化了很多事情，尽管它确实将事件限制在鼠标滚轮上，并且不会在滚动条@Álvaro-右-上触发，因此你需要

滚动

事件并自己跟踪容器的

滚动

，以获得增量/方向。

const handleNavigation = (e: Event) => {
   console.log(e.target)
}