navigator.geolocation.getCurrentPosition 函数在局部范围外调用时结果为未定义

Question

调用时如何在函数外访问navigator.geolocation.getCurrentPosition成功回调的对象？

假设我在导出的文件（称为 UserLoc）中有一个函数。

export const locateCurrentPosition = () => {
  const currentPosition = navigator.geolocation.getCurrentPosition(
    position => {
      console.log(position);
      return position;
    },
    error => {
      console.log(error.message);
      return error;
    },
    {
      enableHighAccuracy: true,
      timeout: 10000,
      maximumAge: 1000
    }
  );

  return currentPosition;
};

现在在我的一个组件 js 文件上，我想在 componentDidMount() 中调用这个函数

const {
  locateCurrentPosition
} = require("../Views/components/User/UserMap/UserLoc");

async componentDidMount(){

console.log(locateCurrentPosition())
locateCurrentPosition().then(data=>console.log(data))
}

当我在 componentDidMount 中调用函数时，它总是 return 未定义。当我记录这个时，它会在本地范围内打印出位置（即上面我使用 console.log(position) 的第一个代码块）。从成功的回调中实际检索位置对象的最佳方法是什么 return 它在调用时进入我的 componentDidMount？

我试过 promises，然后用我的控制台日志和不同类型的 returns 声明，但我似乎总是无法定义。 locateCurrentPosition 函数中的 return 语句似乎不起作用。有什么建议吗？

Answer 1

在 new Promise((resolve,reject)

后添加了箭头

navigator.geolocation.getCurrentPositionreturnsundefined，调用locateCurrentPosition返回的值。 Position 仅传递给调用中提供的回调，可以根据需要将其转换为 promise：

export const locateCurrentPosition = () => new Promise((resolve,reject)=> {
  navigator.geolocation.getCurrentPosition(
    position => {
      console.log(position);
      resolve(position);
    },
    error => {
      console.log(error.message);
      reject(error);
    },
    {
      enableHighAccuracy: true,
      timeout: 10000,
      maximumAge: 1000
    }
  );
});

并使用

调用

locateCurrentPosition().then(position=>console.log(position))

另见 How do I return the response from an asynchronous call

navigator.geolocation.getCurrentPosition 函数在局部范围外调用时结果为未定义

navigator.geolocation.getCurrentPosition function results in undefined when called outside local scope

javascript

geolocation

navigator

react-native