The following code uses an arrow function to pass a function parameter through onClick in React;

import React from 'react';

const ExampleComponent = () => {
  
  function sayHello(name) {
    alert(`hello, ${name}`);
  }
  
  return (
    <button onClick={() => sayHello('James')}>Greet</button>
  );
}

export default ExampleComponent;

Why can't I use <button onClick={sayHello('James')}>Greet</button>? It looks simpler.

I'm a total newbie to ReactJS. Please be patient if it is a trivial question.

The code was extracted from the link below. https://upmostly.com/tutorials/pass-a-parameter-through-onclick-in-react