javascript - .then() 尝试在 promise 解决之前运行

Question

我正在编写一个 React 应用程序，并尝试编写一个返回用户当前位置的函数，以便我可以在我的应用程序中使用它。然而，我对 promise 很陌生，尽管我尽了最大努力，但我的代码仍无法正常工作。代码如下:

const getCurrentLocation = () => {
  if (navigator.geolocation) {
    navigator.geolocation.getCurrentPosition((position) => {
      let currentCoordinates = {
        lat: position.coords.latitude,
        lng: position.coords.longitude
      }
      return Promise.resolve(currentCoordinates)
    })
  } else {
    return Promise.reject(new Error('Get User Location error'))
  }
} 

getCurrentLocation()
  .then((userCoords) => { console.log(userCoords) })
  .catch((error) => { console.log(error) })

我收到错误:“未处理的拒绝(TypeError):无法在“getCurrentLocation()”行读取未定义的属性“then””。我相信这意味着 .then() 试图在 getCurrentLocation() 解析之前执行。

当前坐标填充正确，但在抛出错误之后。

由于我是 Promise 的新手，所以我确信我正在做一些非常简单的错误!

Answer 1

您不能像这样使用Promsise.resolve()，因为您要向回调返回一个值，而不是原始调用者。您需要将调用包装在 promise 中并返回该 promise 。获得结果后，调用 resolve。像这样的东西:

const getCurrentLocation = () => { 
    return new Promise((resolve, reject) =>{
        if (!navigator.geolocation) reject(new Error('Get User Location error'))
        else {
            navigator.geolocation.getCurrentPosition((position) => {
                let currentCoordinates = {
                  lat: position.coords.latitude,
                  lng: position.coords.longitude
                }
                resolve(currentCoordinates)
              })
        }

    })
  }