title: React child component state not updating when new props are passed
body: <p>I'm rendering a custom modal component that is displayed based on props passed in from a parent component. The prop <code>isVisible</code> is initially <code>false</code> and then updated in the parent component via a button. I'm checking the component state via the <code>console.log</code> statement in the render function. When the component is first initialized, it logs <code>false false</code> as expected but when the isVisible is updated, it returns <code>false true</code>. Why is the state not updating with the props?    </p>
  
  <pre><code>class MyModal extends React.Component {
    constructor(props) {
      super(props);
        this.state = {
          createModalVisible:props.isVisible,
        };
  
     setCreateModalVisible = (visible) =&gt; {
       this.setState({createModalVisible:visible});
     }
  
     componentWillMount(){
       this.setCreateModalVisible(this.props.isVisible);
     }
  
    }
    render() {
      console.log(this.state.createModalVisible,this.props.isVisible);
  
      return (//modal stuff)
    }
  }
  export default MyModal
  </code></pre>
  
  <p>I get that this is probably pretty basic component lifecycle stuff but I couldn't figure it out from the docs and am fairly new to React.</p>