在实际运用中我们每一个组件之间要进行联动，这样呢就得使用到组件通信了，接下来我就来简单介绍一下父子组件直接的通信
先决条件
创建一个react项目，在项目中建2个js，放到一个目录下
父传子
在父组件中引入子组件
import Children from './Children';
在render中使用子组件 其中这个name里面的值就是需要传给子组件的值
<Children name="父向子" />
子组件接收
this.props.name
子传父
在父组件中引入子组件
import Children from './Children';
子组件中定义事件，在事件里面传值
//定义事件
<div onClick={()=>this.fnClick()}>子传父</div>
//传值
fnClick(){
this.props.fnChage("132")
}
父组件先在render中使用子组件，接收使用方法接收
<Children fnChage={(res)=>this.fnChage(res)}/>
fnChage(res){
console.log(res);//res就是子组件传递过来的值
}
网友评论