在React中更新状态对象字段的正确方法

class MyComponent extends React.Component {
  constructor(props) {
    super(props);
    this.state = {
      user: {
        name: 'John',
        age: 25,
        email: 'john@example.com'
      }
    };
  }

  updateName = () => {
    // 获取当前状态对象
    const { user } = this.state;

    // 创建新的状态对象，并更新字段
    const updatedUser = {
      ...user,
      name: 'Jane'
    };

    // 更新状态对象
    this.setState({ user: updatedUser });
  }

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

    return (
      <div>
        <p>Name: {user.name}</p>
        <p>Age: {user.age}</p>
        <p>Email: {user.email}</p>
        <button onClick={this.updateName}>Update Name</button>
      </div>
    );
  }
}