React组件间的通信

React组件间的通信

在未用到redux的时候，组件间的通信必不可少；
这其中包括父子之间的通信，子与父之间的通信，还包括兄弟组件之间的通信：
不说太多先上一个例子：
export default class Father extends Component{
constructor(){
super(props);
this.state={
number:1111
}
}
componentDidMount(){}
reder(){
return(

{this.state.number}

)
}
}
1.父与子之间的通信
1).在父组件下的子组件标签添加一个自定义属性,再将需要传的值放进{}里面；

2).在子组件上使用this.props便可以获取
2.子与父之间的通信
1).在子组件上使用ref引用属性；
<child2 ref={node=>this.node.node}>
2).父组件上便可以进行输出；
当然，还可以使用类似父与子通信的方法，首先：

ps：{}里面的是放在父组件上的自定义方法
最后在子组件上可以使用this.props.sendToFather获取到该方法后，然后进行传值，比如：
在child2组件里面添加一个click方法，
<button onClick={this,sentToFather.bind(this,‘Hello,My Fther’)}>
sentToFather(value){
this.props.sendToFather(value)
}
如此，便可以获取到子组件传来的值
3.兄弟之间的通信，比如child1组件需要获取child2组件上的方法；
事实上，就是父子间两个通信的结合，比如，需要child1要获取child2上的方法
1).可以在child2上添加ref属性
2).然后在父组件上设置一个方法：
getChild2Method=()=>{
this.child2ref.menthod()
}
3)最后在child上利用this.props获取