在单击ReactJS上调用多个函数 [英] Call multiple functions onClick ReactJS

问题描述

我知道在vanilla js，我们可以做到

I know in vanilla js, we can do

onclick="f1();f2()"

在ReactJS中对onClick进行两次函数调用相当于什么？

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

我知道调用一个函数是这样的：

I know calling one function is like this:

onClick={f1}

推荐答案

用另一个函数/方法包装你的两个+函数调用。以下是该想法的几种变体：

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

1）单独的方法

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

或ES6课程：

class Test extends React.Component {
   onClick(event) {
      func1();
      func2();
   }
   render() {
      return (
         <a href="#" onClick={this.onClick}>Test Link</a>
      );
   }
}

2）内联

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

或等价的ES6：

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

这篇关于在单击ReactJS上调用多个函数的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！