{foo（）}和{foo}之间的区别

Question

当用户单击按钮时，我遇到了一个JSX表达式，必须执行一个函数。 我想知道引用函数和使用'（）'调用函数之间的区别

例如什么时候使用？

1）

       <button onClick={foo}>Something here</button>

2）

       <button onClick={foo()}>Something here</button>

和函数foo

       const foo = () => {
          console.log('something here');            
        } 

Answer 1

使用

<button onClick={foo()}>Something here</button>

每次组件渲染时都会导致调用函数foo。

使用

<button onClick={foo}>Something here</button>

仅在单击按钮时才会调用它。