Javascript 如何将数据从子组件传输到父组件

我需要弄清楚如何将我在子组件中接收到的数据传输到父组件中的数据。我需要将在子组件中接收的控制台日志设置为转移到父组件状态

目前我有：

 Child Comp: 

    import Picker from 'react-giphy-component'
    import React, { Component, PropTypes } from 'react'




    class AddGif extends Component {


      log (gif) {
        console.log(gif.original.mp4)
      }

     returnedGifObject = gif ;


      render () {
        return (
          <div>
            {/* <button></button> */}
            <Picker onSelected={this.log.bind(this)} />
          </div>
        )
      }
    }

    export default AddGif;


    parent element 
class PostBox extends Component {

  constructor(props){
    super(props)
    this.state = {
      title: null,
      postBody: null,
      giphyUrl: null,

      displayGifPicker: false
    }
  }
    getGifState = (selectedUrl) => {
      this.setState({ giphyUrl: selectedUrl})
    }

      render () {
        const {title, postBody} = this.state
        const displayGifPicker = this.state.displayGifPicker
        return (
          <Grid item xl={8}>
         {/* <Card className={classes.card} style={mt4}>  */}
         <Card style={mt4}> 
          <CardContent > 
              <PostInput onChange={this.handleInputChange} onSubmit={this.handleSubmit}/>
              {displayGifPicker ? (<AddGif selectedGif = {this.getGifState} />) : (<Button size="small" onClick={this.displayGifPicker} ><button>Add Gif</button></Button>)}
            <CardActions>
            {/* <Button size="small">Submit VH5</Button> */}
            </CardActions>
          </CardContent>
        </Card>
      </Grid>
        )
      }
    }

子组件：
从“反应giphy组件”导入选择器
从“React”导入React，{Component，PropTypes}
类AddGif扩展组件{
日志（gif）{
console.log（gif.original.mp4）
}
returnedGifObject=gif；
渲染（）{
返回(
{/*  */}
)
}
}
导出默认的AddGif；
父元素
类邮箱扩展组件{
建造师（道具）{
超级（道具）
此.state={
标题：空，
postBody:null，
giphyUrl:null，
显示选择器：false
}
}
getGifState=（selectedUrl）=>{
this.setState（{giphyUrl:selectedUrl}）
}
渲染（）{
const{title，postBody}=this.state
const displayGifPicker=this.state.displayGifPicker
返回(
{/*   */}
{displayGifPicker？（）：（添加Gif）}
{/*提交VH5*/}
)
}
}

您已将函数prop传递给子组件。然后在Children组件中，只需调用它：

log = (gif) => {
   const { selectedGif } = this.props
   console.log(gif.original.mp4)
   selectedGif(gif.original.mp4)
}

---

请投票并在我的答案中勾选正确，这将帮助其他人