Question: I have a React Component which maintains a Local State as shown below: 

```
  this.state = {
      user : {}
    }

```

I have 2 textboxes on the screen where I can enter name and age. I am sending the values from the textboxes and populating the user object inside the state as shown below: 

```
 onTextBoxChange = (e) => {

   // this.user is a property on the Component declared inside the // constructor
    this.user[e.target.name] = e.target.value

    this.setState({
      user : this.user 
    })
  }

```

Is there a better way of populating the state with the user object which consists of name and age.

Answer: 
There is no need to create an extra variable (`let user =...`) or a member variable (`this.user`).

Just overwrite previous values using spread syntax.

```
  onTextBoxChange = e => {
    this.setState({
      user: {
        ...this.state.user,
        [e.target.name]: e.target.value
      }
    });
  };

```

Here is the fully working version on CodeSandBox.  

[![Edit xjkxnzz34p](https://codesandbox.io/static/img/play-codesandbox.svg)](https://codesandbox.io/s/xjkxnzz34p)
You can achieve the same by following three different ways:

1) There's no need to creating an `this.user` property, instead to can achieve the same by using a local variable. So, the function can be changed to:

```
onTextBoxChange = (e) => {
    let user = this.state.user;
    user[e.target.name] = e.target.value;
    this.setState({
        user: this.user 
    })
}

```

2) If you're not using `user` state in input text boxes for value, then you can simply use `this.user` property instead of using a state, which will cause re-rendering.
You can then use the `this.user` when the form submitted, for example.

3) Again, If you're not using `user` state in input text boxes for value, then you can also use [React `refs`](https://reactjs.org/docs/refs-and-the-dom.html) and get the value directly from the element when the form is submitted, for example.