react native react-native-geocoding address will not render - json

Question

i am creating an app to display user add using react native
after getting user permission and latitude,longitude using expo i used react-native-geocoding to turn cords to address but address would not display
expo permission code
import React from 'react';
import { Alert,Platform,StyleSheet, Text, View } from 'react-native';
import { Constants, Location, Permissions } from 'expo';
import AppStackNav from '../party/src/nav/appStackNav';
import Geocoder from 'react-native-geocoding';
Geocoder.init('xxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx');
export default class App extends React.Component {
state = {
location: null,
errorMessage: null,
addressComponent: null,
};
componentWillMount() {
this._getLocationAsync();
}
_getLocationAsync = async () => {
let { status } = await Permissions.askAsync(Permissions.LOCATION);
if (status !== 'granted') {
this.setState({
errorMessage: 'Permission to access location was denied',
});
}
let location = await Location.getCurrentPositionAsync({
enableHighAccuracy: true,
});
this.setState({ location });
let lat = this.state.location.coords.latitude;
let long = this.state.location.coords.longitude;
Geocoder.from(lat,long).then(json =>
{
var addressComponent = json.results[0].formatted_address;
this.setState({addressComponent})
// Alert.alert(this.state.addressComponent)
})
}
then attempt to display the address while passing as a prop
import React, {Component} from 'react';
import {View,Text,StyleSheet,FlatList} from 'react-native'
import styles from '../style/styles';
class SetConn extends Component {
render(){
return(
<View>
<Text style={styles.addyComp}>{this.props.addressComponent}</Text>
</View>
);
}
}
export default SetConn;

Answer 1

the react-native-geocoder api works from human readable address -> latitude longitude.
Use google reverse geocoding instead.