title: How to reset React component to start from initial state from inside the parent component
body: <pre><code>var A = React.createClass({
  onTabChange:function(e, id){
      this.setState( {tabIndex:id} );
      //Inside this function I would like to get the state of B component 
      //to start from initial state, (i.e. call initialState() function)
  },
  
  render:function(){
      return &lt;div&gt;
          &lt;FormTabs options={['A', 'B', 'C']} onChange={this.onTabChange} value={this.state.tabIndex} /&gt; // This creates 3 simple tabs 
          &lt;B x={5} y={8} z={10} /&gt;
      &lt;/div&gt;;
  }
  </code></pre>
  
  <p>});</p>
  
  <pre><code>var B = React.createClass({
  getInitialState:function(){
      return {
          x: a,
          y: b,
          z: c
      }
  },
  
  render:function(){
      this.state.x = this.props.x;
      this.state.y = this.props.y;
      this.state.z = this.props.z;
  
      return &lt;div&gt;
              //...
          &lt;/div&gt;
  }
  </code></pre>
  
  <p>});</p>
  
  <p>So, what I exactly want is to delete the instance of B component inside the onTabChange function. Any helps about how I can delete the instance of it so that when I call , it gets into B.initialState() function.</p>