I want to pass and have access to the response in another component.

Here is what my Header.js component looks like and would like to have access to the response in for example Table.js

import React, { useState } from 'react';
import Axios from 'axios';
const Header = () => {
const [ticker, setTicker] = useState('');
const [myData, setMyData] = useState('');
let url = \https://cloud.iexapis.com/stable/stock/${ticker}/quote?token=${process.env.REACT_APP_API_KEY}\`;`
const getData = () => {
Axios.get(url)
.then((response) => {
console.log(response.data);
})
.catch(function(error) {
console.log(error);
})
}
const handleKeypress = (e) => {
if(e.keyCode === 13) {
getData();
}
}
return (
<div className='header'>
<h1 id='brand'>Stock Tracker: {ticker}</h1>
<div className='input-flow'>
<input onChange={e => setTicker(e.target.value)}
onKeyDown={handleKeypress}
className='ticker-input'
type='text'
placeholder='Ticker Symbol'
maxLength='5' minLength='1'/>
<button className='add'
onClick={getData}
type='submit'>Add</button>
</div>
</div>
)
}
export default Header