如何在javascript上执行2 onClick操作？

我有点困惑

我需要在onClick this{this.startTextHandler}时执行两个操作，并在单击时发出警报

<Form.Item>
  {/* <button onClick={this.startTextHandler} className="psButton">START THE TEST</button> */}
  <Button onClick={this.startTextHandler} text="START THE TEST" />
</Form.Item>

{/*开始测试*/}

您可以创建一个包含两个事件的函数：

<Button onClick={this.callTwoFuncs} text="START THE TEST" />

<script>
function callTwoFuncs() {
    this.startTextHandler();
    this.sendAlert();
}
...
</script>

函数callTwoFuncs（）{
this.startTextHandler（）；
这是sendAlert（）；
}
...

编写一个函数，完成两件事

startTextHandler(e) {
    // etc
},
doSomethingElse(e) {
    // etc
},
startTextHandlerAndDoSomethingElse(e) {
    this.startTextHandler(e);
    this.doSomethingElse(e);
}

....

onClick={this.startTextHandlerAndDoSomethingElse}

试试这个：

<Button onClick={()=> { this.startTextHandler(); this.secondAction(); } } text="START THE TEST" />

{this.startTextHandler（）；this.secondAction（）；}}}text=“启动测试”/>

您可以传递一个匿名函数：

<Button 
    onClick={(event) => {
        this.startTextHandler(event);
        this.secondMethod(eventOrWhatever)
    }} 
    text="START THE TEST" 
/>

<Button 
    onClick={this.handleClick} 
    text="START THE TEST" 
/>

handleClick = (event) => {
    this.startTextHandler(event);
    this.secondMethod(eventOrWhatever);
}

{
this.startTextHandler（事件）；
this.secondMethod（eventorwhich）
}} 
text=“开始测试”
/>

或命名函数：

<Button 
    onClick={(event) => {
        this.startTextHandler(event);
        this.secondMethod(eventOrWhatever)
    }} 
    text="START THE TEST" 
/>

<Button 
    onClick={this.handleClick} 
    text="START THE TEST" 
/>

handleClick = (event) => {
    this.startTextHandler(event);
    this.secondMethod(eventOrWhatever);
}

handleClick=（事件）=>{
this.startTextHandler（事件）；
第二种方法（事件或其他）；
}

---

顺便说一句：在调试时，命名函数也可以为您提供更好的堆栈跟踪

只需在您的

startTextHandler

中调用

alert（'some text'）

？这是否回答了您的问题？在渲染处理程序内生成函数可能会导致性能问题，最好避免。确实如此，但只要不在列表中的每一行中使用大于100个条目的按钮，就可以了。即使是链接文档也表示只要不出现性能问题就可以了：“一般来说，是的，它是可以的，而且它通常是将参数传递给回调函数的最简单方法。”