在ReactJS中处理事件时，箭头函数vs常规函数

Question

如果我说错了，请指正。

() => this.handleClick()

与

相同

function callHandleClick(){
return this.handleClick()
}

但是下面的可以。

<input type="submit" onClick={ () => this.handleClick() }/>

但是，这不是

<input type="submit" onClick={function callHandleClick(){return this.handleClick()}}/>

我已经定义了handleClick方法。是否可以使用一个正常的功能，而不是箭头功能来处理点击事件?

Answer 1

() => this.handleClick()

和

不一样

function callHandleClick(){
return this.handleClick()
}

对应的是:

const callHandleClick = () => this.handleClick()

因此，在handleClick中定义了一个函数。而是在外部定义它并像这样传递:

onClick={callHandleClick}