title: How do i get location of user before API calls?
body: <p>an app I am trying to make involves a portion where nearby markers are fetched from my server.</p>
  <p>I am sure that my location hook function works, however, it is not finishing before my API call is made to get markers near that location.</p>
  <p>This has confused me for hours, so any help would be greatly appreciated!</p>
  <pre><code>import React, { useEffect, useState } from &quot;react&quot;;
  import MapView, { PROVIDER_GOOGLE, Marker } from &quot;react-native-maps&quot;;
  import { StyleSheet, View, Dimensions, Platform } from &quot;react-native&quot;;
  import useLocation from &quot;../hooks/useLocation&quot;;
  import useApi from &quot;../hooks/useApi&quot;;
  import couponsInArea from &quot;../api/couponsInArea&quot;;
  
  const customData = require(&quot;../assets/map_styles/day_map.json&quot;);
  
  function MapScreen(props) {
  
  //Here is the location hook
   var location = useLocation();
  
  
  const couponBaseApi = useApi(couponsInArea.getCouponBases);
  
  //Here is the API call that needs the location
   useEffect(() =&gt; {
   if (location) {
   couponBaseApi.request(location.latitude, location.longitude);
      }
    }, []);
  
   return (
   &lt;View style={styles.container}&gt;
   &lt;MapView
   followUserLocation={true}
   zoomEnabled={true}
   showsUserLocation={true}
   style={styles.mapStyle}
   provider={PROVIDER_GOOGLE}
   customMapStyle={customData}
   initialRegion={{
   latitude: location.latitude,
   longitude: location.longitude,
   latitudeDelta: 0.0158,
   longitudeDelta: 0.007,
          }}
   &gt;
   {couponBaseApi.data.couponBases.map((report) =&gt; (
   &lt;Marker
   key={report.couponBaseID}
   coordinate={{
   latitude: report.latitude,
   longitude: report.longitude,
              }}
   &gt;&lt;/Marker&gt;
          ))}
   &lt;/MapView&gt;
   &lt;/View&gt;
    );
  }
  const styles = StyleSheet.create({
   container: {
   flex: 1,
   backgroundColor: &quot;#fff&quot;,
   alignItems: &quot;center&quot;,
   justifyContent: &quot;center&quot;,
    },
   mapStyle: {
   width: Dimensions.get(&quot;window&quot;).width,
   height: Dimensions.get(&quot;window&quot;).height,
    },
  });
  
  export default MapScreen;
  </code></pre>