React setState更新嵌套对象的字段

class MyComponent extends React.Component {
  constructor(props) {
    super(props);
    this.state = {
      user: {
        name: 'John',
        age: 25,
        address: {
          city: 'New York',
          country: 'USA'
        }
      }
    };
  }

  updateAddress() {
    // 获取当前状态
    const { user } = this.state;

    // 创建一个新的地址对象，修改其中的字段
    const newAddress = {
      ...user.address,
      city: 'San Francisco'
    };

    // 创建一个新的用户对象，修改其中的地址字段
    const newUser = {
      ...user,
      address: newAddress
    };

    // 更新状态
    this.setState({
      user: newUser
    });
  }

  render() {
    const { user } = this.state;

    return (
      <div>
        <p>Name: {user.name}</p>
        <p>Age: {user.age}</p>
        <p>City: {user.address.city}</p>
        <p>Country: {user.address.country}</p>
        <button onClick={() => this.updateAddress()}>Update Address</button>
      </div>
    );
  }
}