MapView 没有显示用户的位置并且正在停止工作，也无法在 expo react-native 中显示折线

如何解决MapView 没有显示用户的位置并且正在停止工作，也无法在 expo react-native 中显示折线

我正在尝试制作一个地图，显示用户的位置以及传入人员或其他用户的位置，这就像一个超级跟踪的东西，但我无法使用方向 API 来做到这一点，也不是地图正在加载或显示任何内容，请帮助我！这是我目前编写的代码：

import React,{ useState,useEffect } from 'react';


import {
StyleSheet,Text,View,Dimensions,TouchableOpacity,Platform,TextInput,useWindowDimensions,} from 'react-native';
import Icon from 'react-native-vector-icons/MaterialIcons';
import Constants from 'expo-constants';
import * as Animatable from 'react-native-animatable';
import MapView,{ PROVIDER_GOOGLE,Polyline,Marker } from 'react-native-maps';
import * as Location from 'expo-location';
import { decode } from '@mapbox/polyline';

export default function MapViewPage({ navigation }) {
const { width } = useWindowDimensions();
const [LocationData,setLocation] = useState(null);
const [errorMsg,setErrorMsg] = useState(null);
const [Latitude,setLatitude] = useState();
const [Longitude,setLongitude] = useState();
const [coords,setCoords] = useState([]);

useEffect(() => {
 (async () => {
   let { status } = await Location.requestForegroundPermissionsAsync();
   if (status !== 'granted') {
     setErrorMsg('Permission to access location was denied');
     return;
   }

   let location = await Location.getCurrentPositionAsync({});
   setLocation(location);
   setLatitude(location.coords.latitude);
   setLongitude(location.coords.longitude);
 })();
 getDirections('26.1761,91.7629','50.1109221,8.6821267')
   .then((coords) => setCoords(coords))
   .catch((err) => console.log('Something went wrong'));
},[]);

const getDirections = async (startLoc,destinationLoc) => {
 try {
   const KEY = '//freeapikeyfromgooglecloudplatform';
   let resp = await fetch(
     `https://maps.googleapis.com/maps/api/directions/json?origin=${startLoc}&destination=${destinationLoc}&key=${KEY}`
   );
   let respJson = await resp.json();
   let points = decode(respJson.routes[0].overview_polyline.points);
   console.log(points);
   let coords = points.map((point,index) => {
     return {
       latitude: point[0],longitude: point[1],};
   });
   return coords;
 } catch (error) {
   return error;
 }
};

const CustomMarker = () => {
 return (
   <View
     style={{
       backgroundColor: 'black',height: 30,width: 30,borderRadius: 15,}}>
     <Icon color="white" name="home" size={25} />
   </View>
 );
};

return (
 <View style={styles.container}>
   <MapView
     provider={PROVIDER_GOOGLE}
     style={styles.map}
     initialRegion={{
       latitude: Latitude,longitude: Longitude,latitudeDelta: 0.015,longitudeDelta: 0.121,}}>
     <Marker coordinate={{ latitude: Latitude,longitude: Longitude }}/>
   </MapView>

   <Animatable.View animation="slideInUp" style={[styles.Menu]}>
     <TouchableOpacity
       style={{
         flexDirection: 'row',justifyContent: 'space-between',alignItems: 'center',}}
       onPress={() => navigation.openDrawer()}>
       <Icon name="menu" size={25} />
     </TouchableOpacity>
   </Animatable.View>
   <Animatable.View
     animation="slideInUp"
     style={[styles.GarageBox,{ width }]}>
     <TouchableOpacity
       style={{
         flexDirection: 'row',justifyContent: 'space-evenly',width: width / 1.2,}}>
       <TouchableOpacity
         style={{
           borderRadius: 15,width: width / 3,backgroundColor: '#26a55b',height: 40,justifyContent: 'center',}}>
         <Text style={{ color: 'white',fontSize: 16,fontWeight: 'bold' }}>
           Call
         </Text>
       </TouchableOpacity>
       <TouchableOpacity
         style={{
           borderRadius: 15,fontWeight: 'bold' }}>
           Cancel
         </Text>
       </TouchableOpacity>
     </TouchableOpacity>
   </Animatable.View>
 </View>
);
}

const styles = StyleSheet.create({
container: {
 flex: 1,backgroundColor: '#fff',},map: {
 width: Dimensions.get('window').width,height: Dimensions.get('window').height,flex: 1,GarageBox: {
 position: 'absolute',flexDirection: 'row',bottom: 0,height: '30%',padding: 10,shadowColor: '#ccc',shadowOffset: { width: 0,height: 3 },shadowOpacity: 0.5,shadowRadius: 5,elevation: 10,borderTopLeftRadius: 40,borderTopRightRadius: 40,Menu: {
 position: 'absolute',marginTop: 40,marginLeft: 20,borderRadius: 40,});

请提出编辑建议，甚至是您想到的任何内容，我非常需要它:) 谢谢