react中父子组件间如何传值?

  父组件绑定属性值传给子组件,子组件通过this.props()接收。

  例子如下:

  父组件中调用名字为Child的组件:

<Child value={10}/>

  子组件获取方式为:

<p>父组件传递过来的值为:{this.props.value}</p>。//父组件传递过来的值为:10

二、子组件向父组件传值

  子组件绑定一个方法,方法中通过this.props.父组件方法名(参数)传递给父组件,父组件通过该方法接收数据。

  例子如下:

  子组件绑定从父组件传递过来的名字为handleClick的方法,子组件代码如下:

<button onClick={()=>{this.props.handleClick(100)}}>按钮</button>

  父组件中代码如下:

<Child handleClick={handleClick}/>

  

const handleClick = (value) => {
     console.log("子元素传递过来的值为:",value); //子元素传递过来的值为:100
}