父传子1.通过props传值

示例：

//子组件classSonCompoentextendsComponent{render(){return(<View><Text>{this.props.name}的son</Text></View>);};}//父组件classFatherComponetextendsComponent{render(){return(<View><SonCompoentname={this.props.name}/></View>);}}

父组件传递某个（比如name）属性给子组件，在父组件中添加name='xxx';子组件则通过this.props.name获取name的值。

子传父1.通过props回调

示例：

//子组件classSonCompoentextendsComponent{sendName(){this.props.getName('Tom');}render(){return(<View><TextonPress={this.sendName.bind(this)}>Tom</Text></View>);};}//父组件classFatherComponetextendsComponent{getName(name){console.log('son的名字是'name);}render(){return(<View><SonCompoentgetName={this.getName.bind(this)}/></View>);}}

子组件通过调用props传入的方法getName，来修改父组件的name属性。

2.通过ref调用

示例：

//子组件classSonCompoentextendsComponent{constructor(props){super(props);this.name='Tom';this.state={};}render(){return(<View><Text>Tom</Text></View>);};}//父组件classFatherComponetextendsComponent{constructor(props){super(props);this.son={};}sendName(){console.log('son的名字是'this.son.name);}render(){return(<View><SonCompoentref={(v)=>{this.son=v;}}/></View>);}}

父组件通过ref方法获取子组件对象，再通过该对象获取子组件的name属性。

注：父组件中ref的方法需写为ref={(v)=>{this.XXX=v;}，否则在eslint会提示错误

同级组件传递DeviceEventEmitter方法classDiDiCompoentextendsComponent{constructor(props){super(props);this.state={money:0}}componentDidMount(){this.age=10;this.age=20;console.log(this.age);//定义属性,但是对这个属性的修改不会触发renderthis.lister=DeviceEventEmitter.addListener('makeMoney',(money)=>{this.setState({money:money});})}componentWillUnmount(){this.lister.remove();}render(){return(<Viewstyle={styles.didiStyle}><Text>弟弟</Text><Text>收到{this.state.money}零花钱</Text></View>);};}classGeGeComponetextendsComponent{render(){return(<Viewstyle={{flex:1,justifyContent:'center',alignItems:'center'}}><Text>哥哥</Text><TextonPress={()=>{DeviceEventEmitter.emit('makeMoney',100);}}>发生活费</Text></View>);}}

哥哥组件（GeGeComponet）给弟弟组件（DiDiCompoent）零花钱：

• 在哥哥组件中通过DeviceEventEmitter.emit('makeMoney',100)，触发事件makeMoney传递‘零花钱’100。
• 在弟弟组件中通过DeviceEventEmitter.addListener('makeMoney',fn(value))来监听makeMoney事件，并获取值value

参考

ReactNative之父子组件传值（五）