removeEventListener 和 addEventListener 的“没有重载匹配此调用”

Question

我有一个 keydown 处理函数，定义如下：

 handleOnKeyDown = (e: React.KeyboardEvent<HTMLButtonElement>) => {
    if (key.isEscape(e.key)) {
      stopEvent(e);
      this.props.handleClose(e);
    }
  }

但是，在我的代码的另一部分中，将此函数传递给removeEventListenerand addEventListener：

componentDidMount () {
    const { current: modal } = this.modalRef;
    if (modal) {
      modal.addEventListener('keydown', this.handleOnKeyDown);
    }
  }

  componentWillUnmount () {
    const { current: modal } = this.modalRef;
    if (modal) {
      modal.removeEventListener('keydown', this.handleOnKeyDown);
    }
  }

我收到以下打字稿错误：

 handleOnKeyDown = (e: React.KeyboardEvent<HTMLButtonElement>) => {
    if (key.isEscape(e.key)) {
      stopEvent(e);
      this.props.handleClose(e);
    }
  }

什么会解决这个问题？

Answer 1

这个问题似乎已经回答了这个问题： react typescript issues on addEvenListener

addEventListenerand的处理函数removeEventListener不接受 aReact.KeyboardEvent作为参数。它需要一个 DOM 事件。