reactjs - ユーザーの位置を取得するにはどうすればよいですか - React Map GL で使用する

Question

React Map GL を使用しており、ユーザーの緯度と経度を入れたい

次のようにコンポーネントを返します。

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

react-geolocated を使用しようとしましたが、null 座標が返されます。

コンポーネントがマウントされたときにこれらの情報を取得したい、それがコードです:

 componentDidMount() {

    console.log(this.props);
    if (navigator.geolocation) {

     const viewport = {
         ...this.state.viewport,
         latitude: this.props.coords.latitude,
        longitude: this.props.coords.longitude
     };

       this.setState({ viewport });
  }

}

マップ コンポーネント:

<MapGL
            {...viewport}
            //onClick={this.handleMapClick}
            mapStyle="mapbox://styles/mapbox/streets-v9"
            mapboxApiAccessToken={TOKEN}
            perspectiveEnabled
            onViewportChange={viewport => this.setState({ viewport })}
          >
            <div className="geo" style={geolocateStyle}>
              {" "}
              <GeolocateControl
                positionOptions={{ enableHighAccuracy: true }}
                trackUserLocation={true}
              />
            </div>

            <div className="nav" style={navStyle}>
              <NavigationControl
                onViewportChange={viewport => this.setState({ viewport })}
              />
            </div>
          </MapGL>

私はこのような小道具を手に入れています：

{coords: null, isGeolocationAvailable: true, isGeolocationEnabled: true, positionError: null}