2014-09-26 25 views
39

vanilya js, bizÇağrı birden işlevleri onClick ReactJS

onclick="f1();f2()" 

Hangi iki işlevi onClick ReactJS çağrıları yapmak için eşdeğer olacağını yapabileceğini biliyorum? Bir işlevini çağırarak biliyorum

şu şekildedir:

onClick={f1} 
+0

Çok basit: 'ele.onclick = ... 'veya' addEventListener' ile yaptığınız gibi, iki işlevi çağıran bir işlevi iletin. –

cevap

74

senin iki + fonksiyonu başka fonksiyon/yöntemde çağrıları sarın.

1) Ayrı yöntem

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

veya ES6 sınıfları::

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

2) Inline'ın

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

İşte bu fikri birkaç varyantları vardır veya ES6 eşdeğeri:

+4

Ya da daha az optimal: 'onclick = {function() {f1(); f2(); }} ' –

+8

Veya ES6' onclick = {() => {f1(); f2()}} ' –

+2

Veya cjsx:' onClick = {() => f1(); f2()} – Vadorequest