title: Update a state property based on name
body: <p>I am trying to implement an OnChange event where i child component updates a property, and the OnChange even calls a parent method that updates that property in the state.</p>
  
  <p>My child object is created with a prop that points to my onChange event in the parent:</p>
  
  <pre><code>&lt;ChildComponent data={this.state.data} onChange={this.handleStateUpdate} /&gt;
  </code></pre>
  
  <p>My handleStatusUpdate mathed in the parent looks like this:</p>
  
  <pre><code> handleStateUpdate(property, value) {
          console.log("Client index OnChange event called, " + property, value);
          console.log("Before property update", this.state.data);  
          const stateCopy = {  ...this.state.data };
  
          stateCopy[property] = value;
          console.log("Property updated...", stateCopy);
          // Set the value.
          this.setState({stateCopy}, () =&gt; {"New State: ", this.state.data});
  
          console.log("New state: ", this.state)
      }
  </code></pre>
  
  <p>It accepts the name of the property to update as a string, and the new value.</p>
  
  <p>In the child, I have a method that simply calls the props OnChange event, passing the name of the property to change, and then value:</p>
  
  <pre><code>handleNameChange (e)  { this.props.onChange('name', e.target.value); }
  </code></pre>
  
  <p>On the handleStatusUpdate method, when I make a change, the first log line shows the property name and value as expected.</p>
  
  <p>The log of the "New State" reflects the correct change. i.e. My name property is updated to the 'value' value.</p>
  
  <p>But the 'New State' shows the old value. It seems the 'SetState' isn't updating anything. Is there anything wrong with this method, which would stop the state from updating as expected?</p>