React Native中getCurrentPosition无法返回位置值的问题咨询

我一眼就看出问题出在哪了——你用的navigator.geolocation.getCurrentPosition是基于回调的异步API，但你的getCoordinates函数并没有正确处理异步逻辑：既没有返回Promise，也没法把回调里的坐标值传递出来。所以当你在captureImage里直接调用this.getCoordinates()时，函数会立刻返回undefined，根本等不到定位完成。

下面是修复后的完整代码，我会给你解释每一处修改：

1. 重构getCoordinates为Promise风格 #

getCoordinates = async () => {
  console.log('getCoordinates run');
  // 用Promise包裹getCurrentPosition，把回调结果转成异步返回值
  return new Promise((resolve, reject) => {
    navigator.geolocation.getCurrentPosition(
      position => {
        const coordinates = `${position.coords.longitude}, ${position.coords.latitude}`;
        resolve(coordinates); // 把坐标通过resolve返回
      },
      error => {
        Alert.alert(error.message);
        reject(error); // 错误时用reject抛出，方便后续处理
      },
      { enableHighAccuracy: false, timeout: 20000, maximumAge: 1000 }
    );
  });
};

2. 在captureImage中等待坐标结果 #

captureImage = async () => {
  if (this.camera) {
    const options = { quality: 0.5, base64: true };
    const data = await this.camera.takePictureAsync(options);
    console.log(data);

    // 关键：用await等待getCoordinates完成，拿到真实的坐标值
    const coordinates = await this.getCoordinates();
    
    let postData = {
      user: 1,
      coordinates: coordinates,
      image: `data:image/jpeg;base64,${data.base64}`, // 补了前缀里的逗号，原代码会导致图片格式识别失败
    };
    console.log(postData);

    // 修正axios的响应处理：axios已经自动解析了JSON，不用再调用res.json()
    try {
      const response = await axios.post('https://localhost:5000/api/posts', postData);
      console.log('上传成功:', response.data);
    } catch (err) {
      console.log('上传失败:', err);
    }
  }
};

额外的细节说明 #

• 原代码里的图片base64前缀少了个逗号：data:image/jpeg;base64${data.base64}必须改成data:image/jpeg;base64,${data.base64}，否则服务器大概率无法正确识别图片格式。
• 我把axios的then/catch改成了async/await风格，和整体异步逻辑保持一致，代码可读性更高。
• 给getCoordinates加上了reject处理，这样如果定位失败，你可以在captureImage里用try/catch捕获错误，比如提示用户定位失败后再决定是否继续上传。

这样修改后，调用captureImage时会先等待拍照完成，再等待定位拿到坐标，最后构建完整的postData发送给服务器，就能得到你想要的结果了。

内容的提问来源于stack exchange，提问作者Joseph Akayesi