title: How to listen for changes in prop state in React.js?
body: <p>I am porting over a Backbone.View into React. I might be missing something, but I cannot figure out the idiomatic way to make the state of a component dependent on the states of their sibling. For example, say that I have a component like this:</p>
  
  <pre><code>&lt;Timeline&gt;
    &lt;Page selected="true" onClick={this.handleClick} /&gt;
    &lt;Page selected="false" onClick={this.handleClick}/&gt;
  &lt;/Timeline&gt;
  </code></pre>
  
  <p>And let's say all handleClick does it to <code>setState({selected: true})</code>. My question is how do I make sure that the state of the siblings of this component are set to false before it is set to true.</p>
  
  <p>My ideal solution would be to listen for changes in prop state and forceRender the sub-components from the Timeline component, but I don't know if this is an accepted approach.</p>
  
  <p>I am also looking for alternative ways to implement this component, since I understand the <a href="http://facebook.github.io/react/docs/interactivity-and-dynamic-uis.html#what-components-should-have-state">recommended way to decompose the components</a> is to keep them as stateless as possible to ensure they can be reused elsewhere.</p>