从父组件更新子组件的状态

Question

假设我的父组件有两个子组件：

Parent
| Child1
| Child2

我从Child2获得一个输入，并将其传递给父组件（到目前为止，我知道该怎么做）。但是，我需要将该输入传递给Child1，以更新它的状态。

我怎么能那么做？

Answer 1

希望您能得到主要思想--在父组件中创建一个函数，该函数将更改传递给child1的值。ReactJS：为什么传递组件初始状态是一个道具，一个反模式？

class Parent extends Component {
  constructor(props){
    super(props);
    this.state = {
      value: ""
    }
  }
  changeValue(value){
    this.setState({value});
  }
  render(){
    return (
      <div>
          <Child1 value={this.state.value}/>
          <Child2 changeValue={changeValue}/>
      </div>
    )
  }
}


class Child2 extends Component {
  constructor(props) {
    super(props);
    this.state={
      input: ""
    }
  }
  handleChange(e){
    var {value} = e.target;
    this.setState({
      input: value
    },() => this.props.changeValue(value));
  }
  render(){
    return (
      <div>
          <input value={this.state.input} onChange={this.handleChange}/>
      </div>
    )
  }
}



class Child1 extends Component {

  constructor(props) {
    super(props);
    this.state={value:''}
  }
  componentWillReceiveProps(nextProps) {
    this.setState({value: nextProps.value})
  }


  render(){
    return (
      <div>
          {this.props.value}
      </div>
    )
  }
}