React JS - How to add object inside object

Question

I have this code in constructor :

constructor() {
    this.state = {
        recipient: {
          lat: -6.173752,
          lon: 106.8925773
        }
    }
}

And I want to add this to recipient :

var temp = {
  address: 'example street',
  phone: '+623123131321'
}

How to add temp variable to recipient ?

Answer 1

You can override your state using the spread operator

this.state = {
    recipient: {
        ...temp,
        lat: -6.173752,
        lon: 106.8925773
    }
}

Or outside the constructor using setState

this.setState(prevState => ({
   recipient: {...prevState.recipient, ...temp}
}))

Answer 2

You can make use of spread operator to merge the state values

this.setState(prevState => ({
    recipient: {...prevState.recipient, ...temp}
}))