title: Component not updating on props update
body: <p>I am trying to re-render a component based on update to the props from its parent. But unless I use forceUpdate() I cant get the component to re-render on its own. </p>
  
  <p>This is the component where I am updating the component and passing it to the child component:</p>
  
  <pre><code>var StoryContainer = React.createClass({
  
      propTypes: {
          currentItem: React.PropTypes.number.isRequired
      },
  
      componentWillMount: function(){
          metrics.currentItem = 0;
          metrics.nextItem = 2;
      },
  
      handleClick: function(ctx){
          metrics.currentItem++;
          metrics.nextItem++;
  
          var data = this.props.data.slice(metrics.currentItem, metrics.nextItem);
          data[0].idx = metrics.currentItem
          data[1].idx = metrics.nextItem - 1;
          console.log(ctx);
          ctx.props.data = data;
          ctx.props.idx = metrics.currentItem;
          // this.forceUpdate();
      },
  
      render: function(){
          return (
              &lt;StoryItems data={this.props.data.slice(metrics.currentItem,metrics.nextItem)} onChange={this.handleClick} /&gt;
          )   
      }
  });
  </code></pre>
  
  <p>This is the class to which I am passing the updated props.</p>
  
  <pre><code>var StoryItems = React.createClass({
      componentWillReceiveProps: function(nextProps){
          console.log(nextProps);
      },
      componentWillMount: function(a){
          console.log('StoryItems:componentWillMount', a);
      },
      componentDidMount: function(a){
          console.log('StoryItems:componentDidMount', a);
      },
      shouldComponentUpdate: function(nextProps){
          console.log('StoryItems:shouldComponentUpdate', nextProps);
          return true;
      },
      render: function(){
          return (
              &lt;View style={styles.wrapper}&gt;
                  &lt;Story data={this.props.data[1]} onChange={this.handleItemUnmount} /&gt;
                  &lt;Story data={this.props.data[0]} onChange={this.handleItemUnmount} /&gt;
              &lt;/View&gt;
          );
      },
      handleItemUnmount: function(ctx){
          // console.log('here', ctx);
          this.props.onChange(this);
      },
  
  });
  
  module.exports = StoryItems;
  </code></pre>
  
  <p>Can anyone spot something wrong? React n00b here. </p>