react组件传值

在实际运用中我们每一个组件之间要进行联动，这样呢就得使用到组件通信了，接下来我就来简单介绍一下父子组件直接的通信

先决条件

创建一个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就是子组件传递过来的值
}