如何加载React-map-gl，并默认将纬度和经度设置为用户loaction？

import ReactMapGL, { GeolocateControl } from 'react-map-gl';

state = {
  viewport: {
    latitude: 0,
    longitude: 0,
    zoom: 10
  }
};

componentDidMount() {
  if (navigator.geolocation) {
    navigator.geolocation.getCurrentPosition(position => {
      const { latitude, longitude } = position.coords;
      this.setState(prevState => ({
        viewport: {
          ...prevState.viewport,
          latitude,
          longitude
        }
      }));
    });
  }
}

render() {
  const { viewport } = this.state;

  return (
    <ReactMapGL
      {...viewport}
      width="100%"
      height="100%"
      mapboxApiAccessToken={YOUR_MAPBOX_ACCESS_TOKEN}
      onViewportChange={newViewport => this.setState({ viewport: newViewport })}
    >
      <GeolocateControl
        positionOptions={{ enableHighAccuracy: true }}
        trackUserLocation={true}
      />
    </ReactMapGL>
  );
}