user2554585 user2554585 - 1 month ago 106
React JSX Question

Call multiple functions onClick ReactJS

I know in vanilla js, we can do

onclick="f1();f2()"


What would be the equivalent for making two function calls onClick in ReactJS?

I know calling one function is like this:

onClick={f1}

Answer

Wrap your two+ function calls in another function/method. Here are a couple variants of that idea:

1) Separate method

var Test = React.createClass({
   onClick: function(event){
      func1();
      func2();
   },
   render: function(){
      return (
         <a href="#" onClick={this.onClick}>Test Link</a>
      );
   }
});

2) Inline

<a href="#" onClick={function(event){ func1(); func2()}}>Test Link</a>

or ES6 equivalent:

<a href="#" onClick={(event) => { func1(); func2();}}>Test Link</a>