JavaScript

Question

语言：Reactjs 和 vanilla JavaScript

这个问题更像是一个一般性JavaScript回调问题，但我将添加我的 React 代码来展示我是如何陷入这种困境的。

让我们看看塔伦蒂诺的风格，看看我令人困惑的错误：

我正在尝试发送一个回调作为成功回调的参数

navigator.geolocation.getCurrentPosition(success(dataLoaded), error, options);

但它不喜欢，因为根据 docs.

，"pos" 被认为是成功回调的 "sole input parameter "

现在让我们回过头来弄清楚是什么让我陷入困境：

我使用回调作为一种方式让我的 React 应用程序表示异步获取已完成并呈现自身。

onDataLoaded: function() {
    this.setState({
        postsLoaded: true,
    });
  },
  componentDidMount: function(){
    WebAPIUtils.fetchComponentData(this.onDataLoaded);
  },
render: function() {
    if(!this.state.postsLoaded){
        return (<div className="Loading">Loading...</div>);
    }
    return (
      <div>
        //Components can be rendered now since their data is loaded. 
      </div>
    );
  }

一旦下面的代码成功，我需要执行回调：

var options = {
  enableHighAccuracy: true,
  timeout: 5000,
  maximumAge: 0
};

function success(pos) {
  var crd = pos.coords;

  console.log('Your current position is:');
  console.log('Latitude : ' + crd.latitude);
  console.log('Longitude: ' + crd.longitude);
  console.log('More or less ' + crd.accuracy + ' meters.');
  //Here I want to execute my callback to render.
};

function error(err) {
  console.warn('ERROR(' + err.code + '): ' + err.message);
};

navigator.geolocation.getCurrentPosition(success, error, options);

但是 geolocation.getCurrentPosition 有 prescribed callbacks 所以似乎 没有办法将该回调作为成功回调的参数传递

有没有办法将该回调作为成功回调的额外参数传递？作为回调参数发送的回调看起来很奇怪，但形成我的原始回调来处理位置模块外部的位置逻辑也感觉很俗气。

Answer 1

使用bind!

navigator.geolocation.getCurrentPosition(
  success.bind(null, dataLoaded), 
  error, 
  options);

//

function success(dataLoaded, pos) {
  var crd = pos.coords;

  console.log('Your current position is:');
  console.log('Latitude : ' + crd.latitude);
  console.log('Longitude: ' + crd.longitude);
  console.log('More or less ' + crd.accuracy + ' meters.');
  dataLoaded();
}

这实际上创建了一个新版本的函数，您可以在其中替换 this 和预填充参数。因此，传递给 getCurrentPosition 的回调是一个单参数函数，调用时将在您的 success 函数中变为 pos。

JavaScript - 向成功回调添加参数

JavaScript - Adding a parameter to a success callback

asynchronous

callback

reactjs

w3c-geolocation