react-geocode调用fromAddress返回Promise值为undefined如何解决

你拿到undefined的核心原因有两个：

• 你声明了ConvertAddress为async函数，但函数内部没有返回Geocode.fromAddress()生成的Promise链，函数本身没有显式返回值，所以默认返回的Promise resolve值就是undefined
• 你在.then()回调里return的center只在当前Promise回调内部生效，因为没有把整个Promise链暴露到外层，外部访问不到这个返回值；另外你给fromAddress传的resolve参数根本没有定义，属于无效传参。

第一步：重写ConvertAddress函数 #

用async/await简化逻辑，正确返回结果，同时补全错误处理：

async function ConvertAddress(address) {
  // 空地址直接返回空值
  if (!address.trim()) return null;
  try {
    const response = await Geocode.fromAddress(address);
    const { lat, lng } = response.results[0].geometry.location;
    // 直接返回经纬度对象，async函数会自动把它包成Promise返回
    return { lat, lng };
  } catch (error) {
    alert("ConvertAddress error:", error);
    return null;
  }
}

第二步：正确调用函数拿结果 #

async函数永远返回Promise，不能用同步写法直接拿返回值，选以下任意一种方式调用即可：

• 方式1：用await接收结果（注意外层必须是async函数）

async function yourOtherFunction() {
  const center = await ConvertAddress(data[0]);
  console.log("ConvertAddress test", center); // 此处可正常拿到{lat, lng}对象
  // 后续所有依赖center的逻辑都要写在这后面
}

• 方式2：用.then()链式接收结果

ConvertAddress(data[0]).then(center => {
  console.log("ConvertAddress test", center); // 此处拿结果
  // 依赖center的逻辑写在这个回调里
})

注意：地理编码接口请求是异步操作，不要把center赋值给外部全局变量后在函数外同步读取，执行到同步读的代码时接口请求还没完成，拿到的只会是undefined。

内容的提问来源于stack exchange，提问作者zz uu