React 和 Typescript:类型参数不可分配给“EventListenerOrEventListenerObject”类型的参数

fue*_*777 2 typescript reactjs

我正在尝试将 Typescript 添加到我的 React 项目中:

componentDidMount() {
  document.addEventListener('mousemove', this.handleMouseMove);
}

private handleMouseMove = (e: React.MouseEvent<HTMLElement>) => {
  appStore.updateSideWidth(e.pageX);
}
Run Code Online (Sandbox Code Playgroud)

但我在以下情况下遇到了以下错误this.handleMouseMove

[ts]
Argument of type '(e: MouseEvent<HTMLElement>) => void' is not assignable to parameter of type 'EventListenerOrEventListenerObject'.
Type '(e: MouseEvent<HTMLElement>) => void' is not assignable to type 
'EventListenerObject'.
Property 'handleEvent' is missing in type '(e: MouseEvent<HTMLElement>) 
=> void'.
Run Code Online (Sandbox Code Playgroud)

我试过:

1)@ts-ignore它有效,但我不愿意这样做,因为这就是我使用Typescript的原因2)使用类似的东西:

private handleMouseMove = (e: Event) => {
  appStore.updateSideWidth((e as React.MouseEvent<HTMLElement>).pageX);
}
Run Code Online (Sandbox Code Playgroud)

但出现错误,表示由于缺少altKey.

谢谢您的帮助!

Way*_*neC 6

当您e将事件侦听器添加到. 所以 的类型就是ReactdocumenteMouseEvent.

尝试:

componentDidMount() {
  document.addEventListener('mousemove', this.handleMouseMove);
}

private handleMouseMove = (e: MouseEvent) => {
  appStore.updateSideWidth(e.pageX);
}
Run Code Online (Sandbox Code Playgroud)

  • 您可能想尝试`(e: globalThis.MouseEvent)` (4认同)