How to call multiple functions on click with React and JavaScript?

Sometimes, we want to call multiple functions on click with React and JavaScript.

In this article, we’ll look at how to call multiple functions on click with React and JavaScript.

How to call multiple functions on click with React and JavaScript?

To call multiple functions on click with React and JavaScript, we create a function that calls all the functions and use that as the click event handler.

For instance, we write

const App = () => {
  const fun1 = () => {
    console.log("hello");
  };

  const fun2 = () => {
    console.log("world");
  };

  return (
    <div>
      <button
        onClick={() => {
          fun1();
          fun2();
        }}
      >
        Click
      </button>
    </div>
  );
};

to set the onClick prop of the button to a function that calls fun1 and func2 when we click on the button.

Conclusion

To call multiple functions on click with React and JavaScript, we create a function that calls all the functions and use that as the click event handler.