【react】子から親にデータを渡す方法

const UnderstandDialog = (props) => {
  return (
    <Dialog
      className="added-dialog"
      isOpen={props.opened}
      isCancelable={false}>
      <div className="added-message-box">
        {props.message}
      </div>
      <div className="added-button-box">
        <UnderstandButton complete={props.click} text={props.text}/>
      </div>
    </Dialog>
  );
};

<Header title={props.title}  />
<Tabs
  id="toppage-tab"
  defaultIndex={this.state.index}
  onSelect={this.changeTab}>
  <TabPanel>
    <HomePage />
  </TabPanel>
  <TabPanel>
    <SearchPage />
  </TabPanel>
  <Tab className="home-tabbar">
    <div>
      <Img className='tab-image' src={'img/home.svg'} alt={"home"}  />}/><p className='tab-text'>{titles[0]}</p>
    </div>
  </Tab>
            
  <Tab className="about-tabbar">
    <div>
      <Img className='tab-image' src={'img/about.svg'} alt={"about"}  />}/><p className='tab-text'>{titles[1]}</p>
    </div>
  </Tab>
          </TabList>
        </Tabs>

import React, { Component } from 'react';

class About extends Component {
  /**
   * コンストラクタです
   *
   * @param {Object} props
   * @memberof About
   */
  constructor(props) {
    super(props);
    this.state = {
    }
  }
  componentDidMount() {
  }
  render() {
    return (
      <p>about</p>
    );
  }
}

export default withRouter(About);