UglyMyForm.js

class Form extends PureComponent {
  handleChange = e => {
    const { name, value } = e.target
    this.setState({ [name]: value })
  }
​
  handleChangeNested = e => {
    const { name, value } = e.target
    this.setState({
      address: { 
        ...address, 
        city: { 
          ...address.city,
          name: value
        }
      }
      // aqui clonei o address todo, pensando que terá mais campos dentro dele, como number, street e afins 
    })
  }
​
  handleBlur = () => {
    // Alguma validação de campo, warning, etc...
  }
​
  handleSubmit = () => {
    // Submit do form
  }
​
  render() {
    const { email, password, address } = this.state
    return (
      <form onSubmit={this.handleSubmit}>
        <input
          type="email"
          name="email"
          onChange={this.handleChange}
          onBlur={this.handleBlur}
          value={email}
        />
        <input
          type="password"
          name="password"
          onChange={this.handleChange}
          onBlur={this.handleBlur}
          value={password}
        />
        <input
          name="city"
          onChange={this.handleNestedChange}
          onBlur={this.handleBlur}
          value={address.city.name} // será necessário uma tratativa para não 'explodir' o erro 'Cannot read name of null/undefined'
        />
        <button type="submit">
          Submit
        </button>
      </form>
    )
  }
}
export default Form