Sending my current position to Google maps in response

Question

In my application, I implemented a module that receives the latidude and longitude of my current position, and now I want to export this data to googlemap components, so that the default position will be overwritten by my current.

Here is my code structure: location.js

import React from 'react';
import {geolocated} from 'react-geolocated';

class Demo extends React.Component {
render() {

return !this.props.isGeolocationAvailable
  ? <div>Your browser does not support Geolocation</div>
  : !this.props.isGeolocationEnabled
    ? <div>Geolocation is not enabled</div>
    : this.props.coords
      ? <table>
        <tbody>
          <tr><td>latitude</td><td>{this.props.coords.latitude}</td></tr>
          <tr><td>longitude</td><td>{this.props.coords.longitude}</td></tr>
        </tbody>
      </table>
      : <div>Getting the location data&hellip; </div>;
  }
}

export default geolocated({
 positionOptions: {
enableHighAccuracy: false,
},
 userDecisionTimeout: 5000,
})(Demo); 

My googlemap file:

import React from 'react';

export default class GoogleMap extends React.Component{
constructor(){
    super();
    this.state = {
        zoom: 13,
        maptype: 'roadmap',
        lat: -33.8688,
        lng: 141.2195
    }
}

componentDidMount(){
    let map = new window.google.maps.Map(document.getElementById('map'), {
        center: {
            lat: this.state.lat, 
            lng: this.state.lng},
        zoom: 13,
        mapTypeId: 'roadmap',
    })
    console.log('loaded')

}

render(){
    return(
        <div>
            <div id='map' />
        </div>
    )
}
}

And finally, the app.js file (important bits):

import GoogleMap from './components/map';

import Demo from './components/local'

class App extends Component {
render(){
return(
<div> <Demo />  <GoogleMap /> </div>)

I know that I need to somehow export the state between parents and then children, but I really got confused there in a larger project and was completely lost when working with third-party libraries

Answer 1

, {geolocated} componentWillReceiveProps nextProps.coords