Reactjs geocodeAync阻止功能出错，无法进行拍摄

]莱博迪 我正在构建一个基于位置的组件，需要使用城市名称通过get请求将其传递给API，如下所示 get（

/${cityName}/JSON

）

在我编写的组件中，有时运行良好，但大多数情况下都会出现错误（null不是对象（计算'location.coords'））

如何克服这一点，以及如何使用纬度和经度或任何其他方法单独获得cityName

import React, { useState, useEffect } from 'react';
import { Platform, Text, View, Button } from 'react-native';
import Constants from 'expo-constants';
import * as Location from 'expo-location';


export default function App() {
  const [location, setLocation] = useState(null);
  const [errorMsg, setErrorMsg] = useState(null);
  const [city, setCity] = useState('');

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

    let location = await Location.getCurrentPositionAsync({});
    setLocation(location);
    console.log(location);
  }

  const getCity = async () => {
      const place = await Location.reverseGeocodeAsync({
          latitude : location.coords.latitude,
          longitude : location.coords.longitude
      });
      setCity(place.city);
      console.log(city);
  }

    useEffect(() => {
        getLocation() , getCity();
    } , []);



  let text = 'Waiting..';
  if (errorMsg) {
    text = errorMsg;
  } else if (location) {
    text = JSON.stringify(location);
  }

  return (
    <View >
        <Text> </Text>
        <Button title = 'press' 
        onPress = {getCity}
        />
    </View>
  );
}

import React，{useState，useffect}来自“React”；
从“react native”导入{平台、文本、视图、按钮}；
从“expo常量”导入常量；
从“世博会地点”导入*作为地点；
导出默认函数App（）{
const[location，setLocation]=useState（null）；
常量[errorMsg，setErrorMsg]=useState（null）；
const[city，setCity]=useState（“”）；
const getLocation=async（）=>{
让{status}=wait Location.requestPermissionsAsync（）；
如果（状态！=“已授予”）{
setErrorMsg（“访问位置的权限被拒绝”）；
}
let location=await location.getCurrentPositionAsync（{}）；
设置位置（位置）；
控制台日志（位置）；
}
const getCity=async（）=>{
const place=wait Location.reverseGeocodeAsync({
纬度：location.coords.latitude，
经度：location.coords.longitude
});
setCity（地点、城市）；
控制台.日志（城市）；
}
useffect（（）=>{
getLocation（），getCity（）；
} , []);
让text='Waiting..'；
如果（错误消息）{
text=errorMsg；
}else if（位置）{
text=JSON.stringify（位置）；
}
返回(
);
}

因此，问题在于，当组件首次在此处重新设计时，您正在调用getCity，而没有location对象：

useEffect(() => {
    getLocation() , getCity();
} , []);

这两个函数都是异步的，但这并不能保证它们会按该顺序发生。此外，发生的情况是函数并行运行，这会导致错误

这里有多个选项： -您可以将多个承诺链接在一起，以确保执行顺序

---

-您可以从上面的useEffect中删除getCity调用，并仅在getLocation调用完成后调用它（在此之前不允许用户进行交互）

请注意，axios函数是在另一个文件中创建的，这里提到的只是一个示例我认为getCity是在第一次渲染时调用的。