React 组件传参（重要2/3）

1、父向子传

//父组件引子组件上
<Logo parameter={this.state.data}></Logo>
//子组件接收
class Contrast extends Component {
   constructor(props) {
      super(props)
      this.props = props;
   }
 componentDidMount(){
   console.log(this.props.parameter)
 }
}

//父状态更新则子状态也更新。因componentDidMount只执行一次，你会发现并不会跟着更新，后续会再将这个问题

2、子向父传

//子组件
submit(){
//事件通过props触发父组件回调函数
    this.props.onSubmit("123")
}
//使用事件回调
<span onClick={this.submit.bind(this)}>123</span>

//*********************分隔****************************

//父组件
//回调触发函数，完成子父传参
printContent(name){
    console.log(name) //  "123"
}
//引用子组件标签下创建函数等待子组件触发
<About onSubmit={this.printContent.bind(this)}></About>//此标签为实例化子组件

本节东西少但实用