title: React setState not re-rendering
body: <p>In below code, state of Test is updating but its not re-rendering. I have updated the state of parent on button click on change of which I expected it to rerender the whole component including Button. But its not re-rendering Button. Need help wrt this. This is a test code and <strong>both classes are necessary</strong>.</p>
  
  <pre><code>import React from 'react';
  
  class Button extends React.Component {
    constructor(props){
        super(props)
        this.state = {
            id : props.id
        }
    }
    render() {
        console.log('Button state id is', this.state.id)
        return(
            &lt;div&gt;
                'hi ' +  {this.state.id}
                &lt;br/&gt;
                &lt;button type='submit' onClick={this.props.handleSubmit}&gt;
                    submit
                &lt;/button&gt;
            &lt;/div&gt;
        )
    }
  }
  
  export default class App extends React.Component {
    constructor(props) {
        super(props)
        this.state = {
            id: 1
        }
        this.changeId = this.changeId.bind(this)
    }
    changeId() {
        let id = this.state.id
        console.log('parent state id is', id)
        this.setState({
            id: ++id
        })
    }
    render() {
        return(
            &lt;Button id={this.state.id} handleSubmit={this.changeId}/&gt;
        )
    }
  }
  </code></pre>
  
  <p>EDIT: I have modified the code to remove obvious errors like not passing in <code>changeId</code> function to <code>Button</code></p>
  
  <p>EDIT 2: <strong>Found the solution here: <a href="https://stackoverflow.com/questions/41233458/react-child-component-not-updating-after-parent-state-change">React Child Component Not Updating After Parent State Change</a></strong> <code>componentWillReceiveProps</code></p>