Ich benutze ein solches Muster Benutzer die aktuelle Position zu erhalten:componentDidMount, getCurrentPosition Verzögerung
componentDidMount() {
let lat, lon;
navigator.geolocation.getCurrentPosition(function(location) {
lat = location.coords.latitude;
lon = location.coords.longitude;
});
setTimeout(() => {
this.setState({
lat,
lon
})
console.log(this.state.lon, this.state.lat);
}, 1000);
}
Es funktioniert tatsächlich sieht aber „lückenhaft“ wegen setTimeout
. Das Kernproblem besteht darin, dass es einige Verzögerungen beim Abrufen von Standort- und Konsolenwürfen undefined
ohne setTimeout
gibt. Ich habe versucht, ein paar weitere Möglichkeiten, es zu beheben, aber alle gescheitert:
navigator.geolocation.getCurrentPosition(function(location) {
this.setState({
lat: location.coords.latitude,
lon: location.coords.longitude
})
}).bind(this);
und demütig let _this = this
zum Beispiel. Bitte, gibt es einen weiseren Weg zu setState
, basierend auf Geolocation?
Mögliche Duplizieren von https://stackoverflow.com/questions/41278385/updated-state-not- reflecting-after-setstate/41278440 # 41278440 –
Machen Sie eine kleine Änderung an der Position von '.bind (this)' in 'navigator.geolocation.getCurrentPosition (Funktion (location)) { this.setState ({ lat: location.coords. latitude, lon: location.coords.longitude }) } .bind (this)); 'da Sie die Callback-Funktion an' getCurrentPosi binden müssen "und es wird funktionieren. Auch da setState asyc ist, liefert console.log() nach setState nicht genau das richtige Ergebnis. Überprüfen Sie die doppelte Frage –
@ Shubham Khatri ist korrekt. Sie können auch eine Pfeilfunktion anstelle der Bindung verwenden. –