无法从功能传单中访问 this.map

Question

我要做的是每秒在地图上定位用户位置。我知道我可以用setInterval(function(),1000);调用一个函数

我正在用

初始化地图

ionViewDidEnter() {
    this.map = leaflet.map("map").fitWorld();
    this.loadmap();
}

问题是我无法通过定位功能到达地图。

function locate(){

var marker;

this.map.locate({
  setView: true,
  maxZoom: 120
}).on("locationfound", e => {
    if (!marker) {
        marker = new L.marker(e.latlng).addTo(this.map);
    } else {
        marker.setLatLng(e.latlng);
    }
}).on("locationerror", error => {
    if (marker) {
        map.removeLayer(marker);
        marker = undefined;
    }
});
}

如果我删除函数 locate(); this.map.locate 有效，但是因为我想每秒定位用户以跟踪他们的位置，所以我需要每秒调用 .locate，所以我尝试将其放入函数中，每秒使用 setinterval 调用该函数，但它不起作用。有什么办法在不将 .locate 放入函数并调用它的情况下定位用户？

Answer 1

虽然您的问题并不完全清楚，但如果我理解正确，您正在尝试将您的 locate 函数作为 setInterval 的第一个参数调用，但随后您收到一条错误消息，指出 this.map 未定义或其他内容像这样？

在这种情况下，您只需要意识到this 指的是函数调用者的上下文。当您使用setInterval（setTimeout 相同）时，上下文不再是您的类实例对象（具有this.map 的对象），而是全局上下文。问题在这里解释：https://developer.mozilla.org/en-US/docs/Web/API/WindowOrWorkerGlobalScope/setInterval#The_this_problem

有几个简单的解决方案，见Referencing "this" inside setInterval/setTimeout within object prototype methods

话虽如此，既然您想定期跟踪用户的位置，为什么不只依靠map.locate 的watch 选项呢？如果您正在尝试解决某些问题（可能是Leaflet .locate watch option breaks .locate after changing tab Ionic 3？），您很有可能应该解决该问题，而不是尝试解决症状。