値をプロパティ関数に渡しますか？

Question

Iは2つの機能を有する：

zoomIn() { this.setState({zoom: true}) } 
zoomOut() { this.setState({zoom: false}) } 

Iプロパティとして渡す：

<TransitionGroup> 
<Carousel 
    promo={this.props.promo} 
    images={this.props.images} 
    zoom={this.state.zoom} 
    key={this.state.zoom} 
    zoomIn={this.zoomIn.bind(this)} 
    zoomOut={this.zoomOut.bind(this)} 
    /> 
</TransitionGroup> 

カルーセルにI成分内側このようにそれらを使用する：実際に

onClick={this.props.zoomOut} 

、ズームには状態とはかなり異なる値がありますので、私はちょうど1つの関数を持っていたいと思います：

zoom (state) { this.setState({zoom: state} 

私はこのような値を渡してみましたが、それはうまくいきませんでした：

zoom={this.zoom.bind(this, state)} 

Answer 1

代わりに直接小道具を経由して渡されたメソッドを呼び出すと、あなたはが<Carousel>そのため地元方法を定義することができますズームonClickイベントハンドラを処理します。

あなたはそれに渡される引数で小道具として渡されたのいずれかの方法で呼び出すことができます。

カルーセルで：含有する成分で

class Carousel extends React.Component{ 
    constructor(props){ 
    super(props); 
    this.handleClick = this.handleClick.bind(this); 
 // you'll need to bind this to the Carousel component in order to use // this.state properly 
    } 

    // new onClick handler that calls the method passed in via props 
    handleClick() { this.props.zoomOut(this.state) }/ 

    ... // call on onClick (in render method or wherever you have it 
    onClick={this.handleClick} 
    ... 
}

をあなたが定義を変更する必要がありますパラメータを受け入れるzoomOut/zoomIn方法の：

zoomOut (stateArg) { 
    // do something with the stateArg argument passed in here 
    this.setState({zoom: true}) 
} 

zoomIn (stateArg) { 
    // do something with the stateArg argument passed in here 
    this.setState({zoom: true}) 
}