小编典典

调用多个函数 onClick ReactJS

all

我知道在 vanilla JavaScript 中,我们可以这样做:

onclick="f1();f2()"

onClick在 ReactJS中进行两个函数调用的等价物是什么?

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

onClick={f1}

阅读 70

收藏
2022-07-27

共1个答案

小编典典

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

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={() => { func1(); func2();}}>Test Link</a>
2022-07-27