addEventListener鼠标移动和它的事件参数的正确类型是什么？ [英] What are the proper typescript types for addEventListener mousemove and it's event argument?

问题描述

问题：如果不使用any，我的onMouseMove函数的正确类型是什么？

export class Main {
  private dTimer: number;

  constructor() {
    this.init();
  }

  private init() {
    this.mouseHandlers();
  }

  private mouseHandlers() {
    document.addEventListener('mousemove', this.onMouseMove)
  }

  private onMouseMove: EventListener = (event: MouseEvent) => {
    clearTimeout(this.dTimer);
    this.dTimer = setTimeout(() => {
      console.log(event.pageX, event.pageY)
    }, 500);
  }
}

TypeScript抱怨我的类型，我不知道如何在不使用任何类型的情况下让它开心。

main.ts(38,3): error TS2322: Type '(event: MouseEvent) => void' is not assignable to type 'EventListener'.
  Types of parameters 'event' and 'evt' are incompatible.
    Type 'Event' is not assignable to type 'MouseEvent'.
      Property 'altKey' is missing in type 'Event'.

推荐答案

addEventListener Mousemove及其事件参数的正确类型是什么？

明确会让您自由：

onMouseMove: { (event: MouseEvent): void } = (event: MouseEvent) => {
}

或者，让TypeScript从作业🌹推断：

onMouseMove = (event: MouseEvent) => {
}

这篇关于addEventListener鼠标移动和它的事件参数的正确类型是什么？的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！