2017-03-16 5 views
0
fireOne(){ 

} 

render(){ 
    return(
    <p onClick={this.fireOne.bind(this)}></p> 
    ) 
} 

2つのイベントで1つのイベントをバインドできますか? 1つの関数は現在のコンポーネント用ですが、何かを子コンポーネントにも渡したいと思います。イベントで複数のファンクションを反応させる

+1

あなたがダウンして子供たちに何かを渡したい場合は、あなたがの状態を設定することができます親コンポーネントをクリックし、それを小道具として子供に渡します。 – lavish

答えて

1

私は、これはあなたがacomplishしようとしているものだと思うが、私は完全にはわからない:

class MyComponent extends React.Component { 
 

 
    foo1 =() => { console.log('ahh');} 
 
    
 
    foo2 =() => { console.log('beh');} 
 
    
 
    render() { 
 
    return(<div onClick={() => { 
 
     this.foo1(); 
 
     this.foo2(); 
 
    }}>AHH </div>) 
 
    } 
 
} 
 

 
ReactDOM.render(<MyComponent />, document.getElementById('root'));
<script src="https://cdnjs.cloudflare.com/ajax/libs/react/15.1.0/react.min.js"></script> 
 
<script src="https://cdnjs.cloudflare.com/ajax/libs/react/15.1.0/react-dom.min.js"></script> 
 

 
<div id="root"/>

+0

arrow機能を使用する理由なぜそれは 'foo1(){...}'ではありませんか? –

+0

特に、そこに 'this'を参照していないのであれば、矢印機能を使わなくてもそれを使うことができます。しかし、arrow関数を使うと、 'function'という言葉が一切見えない場合にもうまく機能します。それは、あなたが使用するかどうかを知っているかどうかだけで決まります。 – JohnnyQ

+0

@gialaあなたの質問には:this.fireOne.bind(this)、コンテキストを保持したいと思っていました。これはこれを行うより良い方法ですが、パフォーマンスは賢明です。 – ospfranco

関連する問題