Categories
React Answers

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

Spread the love

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.

By John Au-Yeung

Web developer specializing in React, Vue, and front end development.

Leave a Reply

Your email address will not be published. Required fields are marked *