how to customize google maps in ReactJS

Question

I am new to ReactJS. I have used map by referencing this link

it works fine. I have detect my location icon inside search bar. on click, I am able to detect the location and console the formatted address based on lat and long. how ever i wanna display the address inside the search location input box. how do i achieve this?

App.js

import React from 'react';
import MapWithASearchBox from '../components/main_layout/location';
class App extends React.Component {
state = {       
    latitude : '',
    longitude: '',          
};  
 eventHandler() {
    if(navigator.geolocation) {
        navigator.geolocation.getCurrentPosition((position) => {                
            this.setState({
                latitude:position.coords.latitude,
                longitude:position.coords.longitude,});
                this.myfunc(position.coords.latitude, 
                position.coords.longitude)  
            },                  
)        
}
}
  myfunc = (lat, long) => { 

 var geocoder = new window.google.maps.Geocoder();
 console.log(geocoder)

 var latlng = {lat: parseFloat(lat), lng: parseFloat(long)};
geocoder.geocode({'location': latlng}, function(results, status) {
if (status === 'OK') {
  if (results[0]) { 

    const addr = results[0].formatted_address;
    console.log(addr)
  } else {
    window.alert('No results found');
  }
} else {
  window.alert('Geocoder failed due to: ' + status);
}
});  
}
render() {          
    return (
        <div>               
            <MapWithASearchBox />               
        </div>
    );
}
}
export default App;