Reactコンポーネント間のプロパティの共有

Question

Reactを使用してクロックを作成していますが、これは1つのコンポーネントで数値を増減する（デフォルトでは25）オプションを持ち、別のコンポーネントでタイマを更新します私たちは25で始まり、数字が増分または減分されるまで）。

私は2つのコンポーネント（セッションとクロック）が独自のアクションを正常に実行していますが、時計コンポーネントのタイマーの状態を更新するためにカウンタ（セッションコンポーネント）をどのように取得できるのか困っています。具体的には、私はthis.props.minutesといっしょに使っていません。

質問：コンポーネント間でthis.state.minutesプロパティを共有するにはどうすればよいですか？前もって感謝します。私はまだReactの初心者です。

セッション：

const Session = React.createClass({ 

    getInitialState: function() { 
    return { 
     minutes: 25, 
     seconds: 0 
    }; 
    }, 

    increment: function() { 
    this.setState({ minutes: this.state.minutes + 1 }); 
    }, 

    decrement: function() { 
    this.setState({ minutes: this.state.minutes - 1 }); 
    }, 

    timeToString: function(time) { 
    return time + ':00'; 
    }, 

    render: function() { 
    return (
     <section> 
     <button onClick={this.increment}>+</button> 
     <button onClick={this.decrement}>-</button> 
     {this.state.minutes} 
     <Clock/> 
     </section> 
    ); 
    } 

}); 

module.exports = Session; 

時計：

あなたがそうのような時計にセッションから状態で渡す必要が

const Clock = React.createClass({ 

    getInitialState: function() { 
    return { currentCount: 10 }; 
    }, 

    startTimer: function() { 
    var intervalId = setInterval(this.timer, 1000); 
    this.setState({ intervalId: intervalId }); 
    }, 

    pauseTimer: function() { 
    clearInterval(this.state.intervalId); 
    this.setState({ intervalId: this.state.currentCount }); 
    }, 

    timer: function() { 
    var newCount = this.state.currentCount - 1; 
    if (newCount >= 0) { 
     this.setState({ currentCount: newCount }); 
    } else { 
     clearInterval(this.state.intervalId); 
    } 
    }, 

    render: function() { 
    return (
     <section> 
     <button onClick={this.startTimer}>Start</button> 
     <button onClick={this.pauseTimer}>Pause</button> 
     {this.state.currentCount} 
     </section> 
    ); 
    } 

}); 

module.exports = Clock; 

Answer 1

：

<Clock time={this.state.minutes} />をごSessionコンポーネントに

その後に'状態'はクロックコンポーネントでthis.props.timeとして利用できるようになりました

または上記のコードで何を呼び出してもかまいません。

https://facebook.github.io/react/docs/multiple-components.html

編集：中に別のキーのリンク

話の教訓は、その状態が小道具

関連ドキュメントの使用を行ってされる子コンポーネントに親コンポーネントからに渡さですドキュメント：

https://facebook.github.io/react/tips/communicate-between-components.html