我知道在香草JavaScript中,我们可以做到:
onclick="f1();f2()"
在ReactJS中做两个函数调用onClick会等价什么?
我知道调用一个函数是这样的:
onClick={f1}
我知道在香草JavaScript中,我们可以做到:
onclick="f1();f2()"
在ReactJS中做两个函数调用onClick会等价什么?
我知道调用一个函数是这样的:
onClick={f1}
当前回答
在onClick上为任何元素调用多个函数,您可以创建一个包装器函数,类似这样。
wrapperFunction = () => {
//do something
function 1();
//do something
function 2();
//do something
function 3();
}
这些函数可以定义为父类上的方法,然后从包装器函数调用。
你可能有main元素,它会像这样引起onChange,
<a href='#' onClick={this.wrapperFunction}>Some Link</a>
其他回答
如果你必须同时在一个按钮上应用两个函数,那么我们可以在React js中像这样简单地添加。
<button onClick={()=> {fun1(); fun2()}}>Show more</button>
最好的方法:
onClick={() => {f1();f2 ();}}
在onClick上为任何元素调用多个函数,您可以创建一个包装器函数,类似这样。
wrapperFunction = () => {
//do something
function 1();
//do something
function 2();
//do something
function 3();
}
这些函数可以定义为父类上的方法,然后从包装器函数调用。
你可能有main元素,它会像这样引起onChange,
<a href='#' onClick={this.wrapperFunction}>Some Link</a>
也许您可以使用箭头函数(ES6+)或简单的旧函数声明。
正常函数声明类型(非ES6+):
<link href="#" onClick={function(event){ func1(event); func2();}}>Trigger here</link>
匿名函数或箭头函数类型(ES6+)
<link href="#" onClick={(event) => { func1(event); func2();}}>Trigger here</link>
第二条路是我所知道的最短的路。希望对你有所帮助!
功能组件
<button
onClick={() => {
cancelOrder();
handlerModal();
}}
>
Cancel
</button>