Storing an object in state of a React component?

1. this.setState({ abc.xyz: 'new value' }); syntax is not allowed. You have to pass the whole object.

   this.setState({abc: {xyz: 'new value'}});
   

   If you have other variables in abc

   var abc = this.state.abc;
   abc.xyz = 'new value';
   this.setState({abc: abc});
   

2. You can have ordinary variables, if they don't rely on this.props and this.state.

You can use ES6 spread on previous values in the object to avoid overwrite

this.setState({
     abc: {
            ...this.state.abc,
            xyz: 'new value'
           }
});