Currentl, I am doing a React project. I want to ask:
lets say there are 3 components, A,B, and C.
A is my container, B is the input one, and C is the output one.

this is my component A :

```
import React, { Component } from 'react';
import './App.css';
import {SubmitComponent} from './submitComponent.js'
// import {OutputCo} from './TopicsContainer.js'

const containerStyle = {
  border: '2px solid black',
  width: '70%',
  height: 'auto',
  marginLeft: 'auto',
  marginRight: 'auto',
  marginBottom: '100px',
};

class App extends Component {
  render() {
    return (
      <div style={containerStyle}>
        <h1 style={{textAlign:'center'}}>Coding Exercise</h1>
        <hr />
        <SubmitComponent />
        <OutputComponent />

      </div>
    );
  }
}

export default App

```

Component B is SubmitComponent, component C is OutputComponent, my B is taking the input and save it as its state :
import React, { Component } from 'react';

```
import React, { Component } from 'react';
const createstyleouter ={
    border : '2px solid #AAA',
    width : '98%',
    height: 'auto',
    marginLeft: 'auto',
    marginRight: 'auto',
    marginTop:'35px',
    marginBottom:'50px',
};

const createstyleinner ={
    // border: '2px solid blue',
    marginLeft: 'auto',
    marginRight: 'auto',
    marginTop: '10px',
    width: '98%',

}

export class SubmitComponent extends Component {

    constructor(props) {
        super(props);
        this.state = {
            title: '',
            desc: ''
        }
        this.newTitle = this.newTitle.bind(this);
        this.newDesc = this.newDesc.bind(this);
    }

    newTitle(e) {
        this.setState({
            title: e.target.value
        });
    }

    newDesc(e) {
        this.setState({
            desc: e.target.value
        });
    }

    render() {
        return (
            <div style={createstyleouter}>
                <div style={createstyleinner}>
                    <p><strong>Title:</strong></p>
                    <textarea style={{width:'100%', height:'20', fontSize:'17px'}} onChange={this.newTitle} maxLength='150' value={this.state.title} placeholder="Enter your topic's title"></textarea>
                    <p>Description:</p>
                    <textarea style={{width:'100%', height:'70', fontSize:'17px'}} onChange={this.newDesc} maxLength='150' value={this.state.desc} placeholder="Enter your topic's description'"></textarea>
                    <button style={{padding: '10px', marginBottom:'10px'}}>Submit</button>
                </div>
            </div>
        );
    }
}

```

I literally did not have any idea how to send this state to C so C can post is as the topic, 
Please help