React：回调箭头函数与直接触发器

【问题标题】：React: Callback arrow functions vs direct triggerReact：回调箭头函数与直接触发器
【发布时间】：2020-03-17 20:05:37
【问题描述】：

我不确定如何描述它，但假设我有这个代码<button onClick={() => exampleFunction}>Text</button> 和这个代码<button onClick={exampleFunction}>Text</button>，那么这两个示例的工作方式有什么区别？我注意到在onChange 的情况下，只有第二个示例有效。

谁能澄清一下？

【问题讨论】：

你的意思是() => exampleFunction()而不是() => exampleFunction？
在你的第一个例子中你声明了一个匿名箭头函数，在你的第二个例子中你实际上是在执行一些函数
是的，@rayhatfield 解释得很好，但是谢谢

标签： javascript reactjs

【解决方案1】：

在您的第一个示例中，您实际上并没有调用exampleFunction。您提供的函数返回 exampleFunction。

这个：

() => exampleFunction

相当于：

function () { // invoked by the underlying component
  return exampleFunction; // returned, but never called.
}

要修复它，请添加括号：

() => exampleFunction()

在第二种形式中，您直接传递exampleFunction，这是一个函数。它被底层组件调用。

【讨论】：