0
Through this code I receive the current address of the device:
navigator.geolocation.getCurrentPosition(
(position) => {
this.setState({
latitude: position.coords.latitude,
longitude: position.coords.longitude,
error: null,
}, () => this.getGeocode());
},
(error) => this.setState({ error: error.message }),
{ enableHighAccuracy: true, timeout: 20000 },
);
}
// Retorna o endereço a partir da geolocalização
getGeocode() {
axios.get('https://maps.googleapis.com/maps/api/geocode/json?address='+ this.state.latitude +','+ this.state.longitude +'&key=__API_KEY__')
.then(response => {
console.log(response);
this.setState({
place: response.data.results[0].formatted_address
})
}).catch((error) => {
this.setState({ error: error.message })
});
}
And print the address in this field:
<Item floatingLabel>
<Label style={{ color: branco }}>Local da ocorrência</Label>
<Input multiline={true} numberOfLines={2} value={this.state.place.toString()} />
</Item>
So far so good, though i wish that if the user wanted this could delete the address and enter with another, but nowadays, if you try to erase it, it fills up again.
I thought about putting a button there, like "Enter with different address", but there would be no way to simply call once the address, and it is possible to edit this?
(1) Where do the Item, Label, Input components come from? (2) The input component has value set by state,
this.state.place.toString()
and it will always be that every timerender
for call. Usually, text fields are controlled and have an onChangeText prop that updates the status with the new typed data.– nbkhope
@nbkhope vlw, I did some research on the
onChangeText
and I did so:onChangeText={(place) => this.setState({place})}
– Mateus