首页 > 其他 > 详细

react中父子组件间如何传值

时间:2021-05-24 22:45:24      阅读:19      评论:0      收藏:0      [点我收藏+]

一、父组件向子组件传值

  父组件绑定属性值传给子组件,子组件通过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
}

 

react中父子组件间如何传值

原文:https://www.cnblogs.com/gg-qq/p/14806232.html

(0)
(0)
   
举报
评论 一句话评论(0
关于我们 - 联系我们 - 留言反馈 - 联系我们:wmxa8@hotmail.com
© 2014 bubuko.com 版权所有
打开技术之扣,分享程序人生!