Javascript 单击ReactJS调用多个函数

我知道在香草JavaScript中，我们可以做到：

onclick="f1();f2()"

在ReactJS中进行两次函数调用

onClick

的等效方法是什么

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

onClick={f1}

---

将两个以上的函数调用包装到另一个函数/方法中。以下是该想法的几个变体：

1）分离方法

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

var Test=React.createClass({
onClick：函数（事件）{
func1（）；
func2（）；
},
render:function（）{
返回(
);
}
});

或ES6课程：

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

类测试扩展了React.Component{
onClick（事件）{
func1（）；
func2（）；
}
render（）{
返回(
);
}
}

2）内联

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

或ES6同等标准：

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

---

也许您可以使用箭头函数（ES6+）或简单的旧函数声明

正常功能声明类型（非ES6+）：

在这里触发

匿名函数或箭头函数类型（ES6+）

{func1（事件）；func2（）；}}>在此处触发

---

第二条是我知道的最短的路。希望它能帮助你

在onClick上为任何元素调用多个函数，您可以创建一个包装函数，如下所示

wrapperFunction = () => {
    //do something
    function 1();
    //do something
    function 2();
    //do something
    function 3();
}

这些函数可以定义为父类上的方法，然后从包装器函数调用

你可能有一个主要的元素会导致这样的变化

<a href='#' onClick={this.wrapperFunction}>Some Link</a>

您可以使用嵌套

有两个函数，一个是

openTab（）

，另一个是

closeMobileMenue（）

，首先调用

openTab（）

，在

closeMobileMenue（）中调用另一个函数

如果我同时想要两个不同的函数，这个
onclick={（）=>{f1（）；f2（）}}
对我帮助很大。
但现在我想创建一个只有一个按钮的录音机。因此，如果我先单击，我想运行StartFunction
f1（）
，如果我再次单击，我想运行
停止函数
f2（）

你们是如何认识到这一点的？
或者更差的：
onclick={function（）{f1（）；f2（）；}}
或者在ES6
onclick={（）=>{f1（）；f2（）}
或者在cjsx:
onclick={（）=>f1（）；f2（）}
如果第一个是异步的，该怎么办？我希望第二个只有在第一个成功后才能执行completed@Ratnabhkumarrai这是另一个与反应无关的问题。JS中的所有内容都是异步的，非常简单：传递一个调用这两个函数的函数，就像使用
ele.onclick=…
或
addEventListener
一样。如果第一个函数是setState，您需要确保在第二个函数运行之前发生/考虑到这一点，你会发现这篇文章很有帮助：关于一个带生成器的函数怎么样？您可以使用一个变量来决定在一个条件中发生的变化，该条件后面有一个函数，然后使用yield
const play=（）=>{console.log（“play”）；}const pause=（）=>{console.log（“paused”）；}function*audioSwitcher（）{let paused=true；而（true）{if（paused）{play（）；}else{pause（）；}yield paused=！paused；}}
wrapperFunction = () => {
    //do something
    function 1();
    //do something
    function 2();
    //do something
    function 3();
}

<a href='#' onClick={this.wrapperFunction}>Some Link</a>

function openTab() {
    window.open('https://play.google.com/store/apps/details?id=com.drishya');
    closeMobileMenue()   //After open new tab, Nav Menue will close.  
}

onClick={openTab}