如何将属性传递给只更改一个值的组件

constructor(props) {
  super(props);
  this.state = {
    attribute: '初始值'
  };
}

render() {
  return (
    <div>
      <ChildComponent attribute={this.state.attribute} />
    </div>
  );
}

class ChildComponent extends React.Component {
  handleClick() {
    // 更改属性值
    this.props.attribute = '新值'; // 错误的写法，props是只读的，不能直接修改

    // 正确的写法是通过回调函数通知父组件更改属性值
    this.props.onChangeAttribute('新值');
  }

  render() {
    return (
      <div>
        <button onClick={this.handleClick.bind(this)}>更改属性值</button>
      </div>
    );
  }
}

handleChangeAttribute(newValue) {
  this.setState({
    attribute: newValue
  });
}

render() {
  return (
    <div>
      <ChildComponent attribute={this.state.attribute} onChangeAttribute={this.handleChangeAttribute.bind(this)} />
    </div>
  );
}