react同级组件传值

在React中，同级组件之间传递值是通过它们共同的父组件来实现的。具体步骤如下：

1. 在父组件中定义一个状态（state），用于存储需要传递给子组件的值。
2. 在父组件中创建一个方法，用于更新状态（state）的值。
3. 将这个方法作为props传递给需要接收值的子组件。
4. 在子组件中通过props接收并使用这个值。

下面是一个示例代码来说明这个过程：

// 父组件
class ParentComponent extends React.Component {
  constructor(props) {
    super(props);
    this.state = {
      value: ''
    };
  }

  // 更新状态值的方法
  updateValue = (newValue) => {
    this.setState({ value: newValue });
  }

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

// 第一个子组件
class ChildComponent extends React.Component {
  render() {
    return (
      <div>
        <p>接收到的值：{this.props.value}</p>
      </div>
    );
  }
}

// 第二个子组件
class AnotherChildComponent extends React.Component {
  handleClick = () => {
    // 调用父组件传递的方法来更新值
    this.props.updateValue('新的值');
  }

  render() {
    return (
      <div>
        <button onClick={this.handleClick}>更新值</button>
      </div>
    );
  }
}

在上面的例子中，父组件`ParentComponent`中定义了一个`value`状态，并将其传递给子组件`ChildComponent`。另外，父组件还将一个方法`updateValue`作为props传递给另一个子组件`AnotherChildComponent`。当点击`AnotherChildComponent`中的按钮时，调用`updateValue`方法来更新父组件中的值。

这样，子组件`ChildComponent`就能够接收并显示父组件中的值了。