Question

我正在尝试删除一个事件监听器，但我在Typescript中收到错误，因为removeEventListener需要类型EventListenerOrEventListenerObject，但此事件处理程序的类型是FormEvent：

private saveHighScore (event: React.FormEvent<HTMLInputElement>) {

这是移除事件的方式：

window.removeEventListener('click', this.saveHighScore);

错误讯息：

TS2345: Argument of type '(event: FormEvent<HTMLInputElement>) => void' is not assignable to parameter of type 'EventListenerOrEventListenerObject'. Type '(event: FormEvent<HTMLInputElement>) => void' is not assignable to type 'EventListenerObject'. Property 'handleEvent' is missing in type '(event: FormEvent<HTMLInputElement>) => void'.

那么删除反应FormEvent的正确方法是什么？

更新我正在添加这样的事件：

<input onClick={this.saveHighScore} className="btn btn--high-score" type="submit" value="Save"/>

Answer 1

处理程序在React中管理，因此请将管理保留在那里。如果添加侦听器应该是有条件的，那么在render方法中进行管理。如下所示：

saveHighScore = () => {
  this.setState({
    scoreSaved: true,
  });
}

render() {
  const onClickHandler = this.state.scoreSaved ? null : this.saveHighScore;
  return (
    <input onClick={onClickHandler} className="btn btn--high-score" type="submit" value="Save"/>
  );
}

尝试使用FormEvent类型删除事件时出现Typescript错误

1 个答案: