Cannot read property 'geocodePosition' of undefined

This is my code:

import React, { Component } from 'react';
import { 
  AppRegistry, 
  View, 
  Text
} from 'react-native';
import Geocoder from 'react-native-geocoder'; // 0.5.0

Geocoder.apiKey = '__API__KEY__';

export default class teste47 extends Component {
  constructor(props) {
    super(props);

    this.state = {
      latitude: null,
      longitude: null,
      place: 'Localizando endereço...',
      error: null,
    };
  }

  componentDidMount() {
   navigator.geolocation.getCurrentPosition(
    position => {
      this.setState(
        {
          latitude: position.coords.latitude,
          longitude: position.coords.longitude,
          error: null,
        },
        () => {
          Geocoder.geocodePosition({
            lat: this.state.latitude,
            lng: this.state.longitude,
          }).then(res => {
            this.setState({
              place: res[0].formattedAddress,
            });
          });
        }
      );
    },
    error => this.setState({ error: error.message }),
    { enableHighAccuracy: true, timeout: 20000 }
  );
 }

  render() {
    return (
      <View style={{ flexGrow: 1, alignItems: 'center', justifyContent: 'center' }}>
        <Text>Latitude: {this.state.latitude}</Text>
        <Text>Longitude: {this.state.longitude}</Text>
        <Text>{this.state.place.toString()}</Text>
        {this.state.error ? <Text>Error: {this.state.error}</Text> : null}
      </View>
    );
  }
}

AppRegistry.registerComponent('teste47', () => teste47);

I created the project with react-native init I added the <uses-permission android: name = "android.permission.ACCESS_FINE_LOCATION" /> to AndroidManifest.xml and I used the react-native link to link.

But when I run the project this returns latitude and longitude to then display an error screen:

I really have not found the error, what can it be?

Having the same problem here!

I ended up giving up using the library, through the help I received in stackoverflow, I solved my problem by performing the requisition for google api:

componentWillMount() {
  navigator.geolocation.getCurrentPosition(
  (position) => {
    this.setState({
      latitude: position.coords.latitude,
      longitude: position.coords.longitude,
      error: null,
    }, () => this.getGeocode()); // call the api after getCurrentPosition is finished
  },
   (error) => this.setState({ error: error.message }),
   { enableHighAccuracy: true, timeout: 20000 },
 );

}
getGeocode() {
 axios.get('https://maps.googleapis.com/maps/api/geocode/json?address='+ this.state.latitude +','+ this.state.longitude +'&key=__API_KEY__') // be sure your api key is correct and has access to the geocode api
.then(response => {
  console.log(response);
    this.setState({
        place: response.data.results[0].formatted_address // access from response.data.results[0].formatted_address
    })
 }).catch((error) => { // catch is called after then
   this.setState({ error: error.message })
 });
}

But I still want to find out why I can not do it with the library.

Facing same problem

Run react-native link react-native-geocoder and rebuild work for me

Better to link manually

Navigation Menu

Repository navigation

Cannot read property 'geocodePosition' of undefined #62

Metadata

Assignees

Labels

Projects

Milestone

Relationships

Development

Cannot read property 'geocodePosition' of undefined #62

Description

Activity

deniscapp commented on Nov 1, 2017

Mate38 commented on Nov 1, 2017

SaifulBashar commented on Nov 2, 2017

Vnicius commented on Jan 27, 2018

ankitsinghania94 commented on Feb 2, 2018

Metadata

Metadata

Assignees

Labels

Projects

Milestone

Relationships

Development

Issue actions