Trying to get a restaurant name from Google Places API.
First page displays the list of restaurants, and when user selects one, it passes place_id as an id value to a second page (that I m currently working on).
I managed to grab the data and it displays in console line 23 console.log(result); displays data in console
However, in line 36 {result.name} displays nothing. As I set useState(null), I wonder if it empties it before it gets to the ?
import React, {useState, useEffect} from react ;
import { View, Text, StyleSheet, Flatlist, Image } from react-native ;
import axios from "axios";
import { FlatList } from react-native-gesture-handler ;
const GResultsShowScreen = ({navigation}) => {
const [result, setResult] = useState(null);
const baseURL = https://maps.googleapis.com/maps/api/place/details/json?key=MYAPIKEY ;
const id = navigation.getParam( id );
const getResult = async (id) => {
const response= await axios.get(`${baseURL}`, {
params: {
place_id: id
}}
);
setResult(response.data);
};
console.log(result);
useEffect(() => {
getResult(id);
}, []);
if (!result) {
return console.log( nodata );
}
return (
<View>
<Text>test {result.name} </Text>
</View>
);
};
const styles = StyleSheet.create({});
export default GResultsShowScreen;type here
and this is the console output by console.log(result); so at this point there is data in result
[console output] console output in plain textview
