() => someFunc 和 someFunc 之间的区别

Difference between () => someFunc and someFunc

我有一个 React 组件

import React from 'react';

function App() {

  const someFunc = () => {
    console.log('clicked');
  }

  return (
    <div >
      <button onClick = {() => someFunc}>Button 1</button>
      <button onClick = {someFunc}>Button 2</button>
    </div>
  );
}

export default App;

调用 onClick = {() => someFunc}onClick = {someFunc} 有什么区别。在此先感谢您的帮助。

onClick = {() => someFunc}

这只是在 onClick 处理程序 运行 时返回对 someFunc 的引用。这不会做任何事情(不会像你期望的那样工作)。

onClick = {someFunc}

这是传递对 someFunction 的直接引用,它将在调用 onClick 处理程序时被调用。你可以考虑把someFnnction的body放在这里,因为它是这样的

onClick = {() => {
    console.log('clicked');
  }}