1,父组件向子组件传递

在引用子组件的时候传递,相当于一个属性,例如:

class Parent extends Component{
  state = {
    msg: 'start'
  };

  render() {
    return <Child parms={this.state.msg} />;
  }
}

class Child extends Component{
  render() {
    return <p>{this.props.parms}</p>
  }
}

2,子组件向父组件传递

子组件通过 调用父组件传递到子组件的方法 向父组件传递消息的。

父组件向子组件传递函数:

     <Child parm={this.state.msg} transMsg={msg=>this.transMsg(msg)}/>

子组件调用父组件函数:
this.props.transMsg(parms);

完整代码:

“` js

class Parent extends Component{

constructor(props) {
    super(props);
    state = {
        msg: 'start'
    };
}
transMsg(types){
    var newOrders = [];
    for(let type of types){
        if(type)
        alert(type);
    }
    
  }

render() {
return

 constructor(props) {
    super(props);
    // call parent component
    console.log("parms :",this.props.parms);
   this.props.transMsg("hi ~~");
}

render() {
return

{this.props.parms}

}
}

版权声明:本文为mingbai原创文章,遵循 CC 4.0 BY-SA 版权协议,转载请附上原文出处链接和本声明。
本文链接:https://www.cnblogs.com/mingbai/p/componentTransMsg.html