React-native-google-places-autocomplete: The library doesn't show any result

[GervaisYO]

Hello,

i'm facing some difficulties to setup react-native-google-places-autocomplete properly in a react-native project.
Here are the steps i did:

1. yarn add react-native-google-places-autocomplete
2. Then i executed the following code:

```import React from 'react';
import { View, Image } from 'react-native';
import { GooglePlacesAutocomplete } from 'react-native-google-places-autocomplete';

const homePlace = { description: 'Home', geometry: { location: { lat: 48.8152937, lng: 2.4597668 } }};
const workPlace = { description: 'Work', geometry: { location: { lat: 48.8496818, lng: 2.2940881 } }};

const GooglePlacesInput = () => {
return (
placeholder='Search'
minLength={2} // minimum length of text to search
autoFocus={false}
returnKeyType={'search'} // Can be left out for default return key https://facebook.github.io/react-native/docs/textinput.html#returnkeytype
listViewDisplayed='auto' // true/false/undefined
fetchDetails={true}
renderDescription={row => row.description} // custom description render
onPress={(data, details = null) => { // 'details' is provided when fetchDetails = true
console.log(data, details);
}}

  getDefaultValue={() => ''}

  query={{
    // available options: https://developers.google.com/places/web-service/autocomplete
    key: 'YOUR API KEY',
    language: 'en', // language of the results
    types: '(cities)' // default: 'geocode'
  }}

  styles={{
    textInputContainer: {
      width: '100%'
    },
    description: {
      fontWeight: 'bold'
    },
    predefinedPlacesDescription: {
      color: '#1faadb'
    }
  }}

  currentLocation={true} // Will add a 'Current location' button at the top of the predefined places list
  currentLocationLabel="Current location"
  nearbyPlacesAPI='GooglePlacesSearch' // Which API to use: GoogleReverseGeocoding or GooglePlacesSearch
  GoogleReverseGeocodingQuery={{
    // available options for GoogleReverseGeocoding API : https://developers.google.com/maps/documentation/geocoding/intro
  }}
  GooglePlacesSearchQuery={{
    // available options for GooglePlacesSearch API : https://developers.google.com/places/web-service/search
    rankby: 'distance',
    types: 'food'
  }}

  filterReverseGeocodingByTypes={['locality', 'administrative_area_level_3']} // filter the reverse geocoding results by types - ['locality', 'administrative_area_level_3'] if you want to display only cities
  predefinedPlaces={[homePlace, workPlace]}

  debounce={200} // debounce the requests in ms. Set to 0 to remove debounce. By default 0ms.
  renderLeftButton={()  => <Image source={require('path/custom/left-icon')} />}
  renderRightButton={() => <Text>Custom text after the input</Text>}
/>

);
}

But somehow there are no result when i type some thing.
I tried to run react-native link react-native-google-places-autocomplete but this seems to not work either, i just see in the command line : Scanning folders for symlinks in /Users/gsiewe/Ndolo/Chat_Yamo_Android/google_places/node_modules (21ms) and that's it.

Is there something i'm missing during the installation?
Does anymore have an idea what could be the issue here?

I'm using react-native version 0.55.4.

Thank you.

[adrian-casanova]

Wrap the GooglePlacesAutocomplete tag in a View tag and set a height. It worked for me.

[GervaisYO]

i wrapped the GooglePlacesAutocomplete tag in a View tag and set the height, but it still doesn't show any result

[maximeGirma]

query={{ // available options: https://developers.google.com/places/web-service/autocomplete key: 'YOUR API KEY', language: 'en', // language of the results types: '(cities)' // default: 'geocode' }}

Did you place your API key in the key field?

[guilhermepontes]

You need to set your API Key.