Question

这看起来很简单，但我无法解决这个问题我总是在控制台中收到相同的消息：

类型错误：类型'（event：MouseEvent）=> void'不能分配给'（）=> Event'类型。 TS2322

这是我的代码：

//in one class  
//some code 
return <div className={keyStyle} key={key} onClick={()=> 
this.props.turnKey()}>
render() {</div>

//in other classs
//some code
    return (
       <div className="container">
          <Display />
          <Keys turnKey={this.activateKey}/>
       </div>
    );
  }

  activateKey = (event : React.MouseEvent): void =>{
      console.log(event.target);
  }

如何解决此错误？

Answer 1

您没有将event（这是必需的）传递给this.props.turnKey。我建议您照原样通过this.props.turnKey：

<div className={keyStyle} key={key} onClick={this.props.turnKey}>

可能可以解决您的问题。

如果不是，则道具this.props.turnKey的声明存在一些问题。您可能已经这样声明了

turnKey: () => Event

代替

turnKey: (event: React.MouseEvent) => void

Answer 2

关于 event.target 的问题：TS2532：对象可能是“未定义”。

您可以将目标声明为 HTMLDivElement。于是

  activateKey = (event : React.MouseEvent): void =>{
    const clickedElement = event.target as HTMLDivElement;
    console.log(clickedElement.value); // ot whatever you need
  }

应该可以解决问题。

（event：MouseEvent <element，mouseevent =“”>）=> void'不能分配给类型'（）=> Event'

2 个答案: