navigator.geolocation.getCurrentPosition 函数在本地范围外调用时导致未定义

Posted 2023-02-23

【中文标题】navigator.geolocation.getCurrentPosition 函数在本地范围外调用时导致未定义

【英文标题】：navigator.geolocation.getCurrentPosition function results in undefined when called outside local scope

【发布时间】：2019-12-03 22:05:30

【问题描述】：

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 中调用函数时，它总是返回一个未定义的。当我记录这个时，它会打印出在本地范围内的位置（即上面我使用console.log（位置）的第一个代码块。从成功的回调中实际检索位置对象并将其返回的最佳方法是什么？我的 componentDidMount 什么时候被调用？

我尝试过承诺，然后用我的控制台日志声明以及不同类型的返回，但我似乎总是不确定。 locateCurrentPosition 函数中的返回语句似乎不起作用。有什么建议吗？

【问题讨论】：

这能回答你的问题吗？ How do I return the response from an asynchronous call?

【参考方案1】：

在 new Promise((resolve,reject) 后添加箭头

navigator.geolocation.getCurrentPosition返回undefined，调用locateCurrentPosition返回的值。位置只传递给调用中提供的回调，可以根据需要转为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

【讨论】：

谢谢这很好用。稍作修改。由于缺少 =>，我收到语法错误。我将在下面发布答案。谢谢您的帮助。我对承诺不太熟悉。我尝试使用 awaits 和 async，因为我认为它们类似于 Promise，但没有任何运气。

更正，我编辑了您的帖子以显示丢失的箭头。再次感谢。