title: Child component constructor called multiple times
body: <p>I have a parent component which is a flat list which contains a header <code>HeaderComponent</code>. This <code>HeaderComponent</code> is a custom component that I have created which contains 2 child components of its own. Whenever i refresh the list, I am passing a boolean to the <code>HeaderComponent</code> as props which get passed onto its own children, I am doing this so I can check if each component needs to fetch new data or not. The problem is that whenever the parent refreshes and sets a new state the constructors of the child components get called everytime. Shouldn't the constructor be called only the first time the parent initializes and then all further calls involve calling the shouldComponentUpdate method of the children in order to see if it needs an update or not.</p>
  
  <p>Parent component</p>
  
  <pre><code>_renderHeader = () =&gt; {
      return &lt;HeaderComponent Items={this.state.Data} refresh={this.state.refresh}/&gt;;
  };
  
  render() {
      console.log("TAG_RENDER render called " + this.state.refresh);
      return (
          &lt;FlatList
              refreshing={this.state.refresh}
              onRefresh={() =&gt; {
                  console.log("onRefresh");
                  this.setState({
                      refresh: true
                  }, () =&gt; {
                      this._fetchData();
                  });
              }}
              ......
  
  
              ListHeaderComponent={() =&gt; this._renderHeader()}
              .......
          /&gt;
      );
  }
  </code></pre>
  
  <p>Header Component</p>
  
  <pre><code>export default class HeaderComponent extends React.Component {
  
      constructor(props) {
          super(props);
          console.debug("HeaderComponent");
      }
  
      render() {
          return (
              &lt;MainHeader Items={this.props.Items}/&gt;
              &lt;SubHeader refresh={this.props.refresh}/&gt;
          );
      }
  
  }  
  </code></pre>
  
  <p>The constructor of <code>MainHeader</code> and <code>Subheader</code> gets called whenever the parent component refreshes. Does this mean that it is creating new child components each time it refreshes because I can see the render of the children also being called multiple times.</p>