从子小部件更改父小部件中的属性

// 父组件
class ParentComponent extends React.Component {
  constructor(props) {
    super(props);
    this.state = {
      parentProperty: '初始值'
    };
    this.handleChildPropertyChange = this.handleChildPropertyChange.bind(this);
  }

  handleChildPropertyChange(newValue) {
    this.setState({ parentProperty: newValue });
  }

  render() {
    return (
      <div>
        <h1>父组件</h1>
        <p>父组件属性值: {this.state.parentProperty}</p>
        <ChildComponent
          childProperty={this.state.parentProperty}
          onChildPropertyChange={this.handleChildPropertyChange}
        />
      </div>
    );
  }
}

// 子组件
class ChildComponent extends React.Component {
  constructor(props) {
    super(props);
    this.handleChange = this.handleChange.bind(this);
  }

  handleChange(event) {
    const newValue = event.target.value;
    this.props.onChildPropertyChange(newValue);
  }

  render() {
    return (
      <div>
        <h2>子组件</h2>
        <p>子组件属性值: {this.props.childProperty}</p>
        <input
          type="text"
          value={this.props.childProperty}
          onChange={this.handleChange}
        />
      </div>
    );
  }
}