6
votes

react-native-google-places-autocomplete ne fonctionne pas

react-native-google-places-autocomplete ne fonctionne pas, je suis confronté à plusieurs problèmes 1. le menu déroulant des lieux ne s'affiche pas 2. le gestionnaire onPress ne se déclenche pas du tout

Remarque: toutes les API de localisation de Google sont activées, l'API de Google Maps, l'API de lieux et l'API de géocodage sont activées et une clé d'API valide est fournie.

J'ai essayé toutes les solutions possibles disponibles sur Internet 1. définir zIndex: 1000 une valeur élevée pour éviter qu'il ne soit caché derrière une autre vue 2. J'ai essayé de créer une nouvelle application RN et ajouté uniquement ce composant pour garder le projet propre 3. A référencé un autre poste SO et essayé de le réparer

ici l'extrait de code

<GooglePlacesAutocomplete
  placeholder="Search"
  minLength={2} // minimum length of text to search
  autoFocus={false}
  fetchDetails={true}
  onPress={(data, details = null) => {
    // 'details' is provided when fetchDetails = true
    console.log(data);
    console.log(details);
  }}
  getDefaultValue={() => {
    return ''; // text input default value
  }}
  query={{
    // available options: https://developers.google.com/places/web-service/autocomplete
    key: 'VALID_API_KEY',
    language: 'en', // language of the results
  }}
  styles={{
    description: {
      fontWeight: 'bold',
    },
    predefinedPlacesDescription: {
      color: '#1faadb',
    },
    listView: {
      color: 'black', //To see where exactly the list is
      zIndex: 1000, //To popover the component outwards
      position: 'absolute',
      top: 45
    },
  }}
  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
    }
  }
  GooglePlacesDetailsQuery={{
    // available options for GooglePlacesDetails API : https://developers.google.com/places/web-service/details
    fields: 'formatted_address',
  }}
  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]}
  predefinedPlacesAlwaysVisible={true}
/>


5 commentaires

Salut @Sadand, Avez-vous pu résoudre ce problème? Si vous avez réussi à le résoudre, pouvez-vous s'il vous plaît partager ce que vous avez fait?


@AhmadAli pas encore, je suis toujours en train de l'explorer.


Avez-vous trouvé une solution?


@mendy toujours pas ...


Essayez celui-ci - npmjs.com/package/react-native-places-input


5 Réponses :


4
votes

J'ai eu le même problème avec cette bibliothèque, et après avoir essayé pendant des heures, j'ai trouvé une solution. Le problème était dans la configuration de facturation sur les API Google. Essayez de configurer le projet où vous utilisez la clé et d'activer les configurations de facturation, cela a résolu mon problème. S'il vous plaît laissez-moi savoir si cela fonctionne pour vous.

PS J'espère que cela peut vous aider.


0 commentaires

0
votes

Ce package n'est plus maintenu et ne fonctionne tout simplement pas. Je n'ai même pas eu de liste de résultats. J'ai trouvé un autre package qui fonctionne parfaitement

https://www.npmjs.com/package/react-native-places-input


3 commentaires

ce n'est pas vrai, le projet est toujours en ligne et bien entretenu. Voir les dernières versions github.com/FaridSafi/react-native-google-places-autocomplete‌ /…


il fait juste la promotion de sa propre solution


Désolé, j'ai vu quelque part sur le dépassement de la pile que ce package n'est plus pris en charge et je suis venu ici pour aider. J'ai peut-être été trompé par quelqu'un qui faisait la promotion de sa solution



1
votes

Vous devez activer et activer votre facturation sur la console Google.


0 commentaires

0
votes

Le package fonctionne et est bien entretenu. Votre problème est que votre clé API n'est pas configurée correctement. Vous n'avez pas non plus besoin d'activer la facturation (cela fonctionne pour moi sans aucun détail de facturation).

Dans la console des développeurs Google, créez une nouvelle clé API sans aucune restriction et voyez si cela fonctionne (cela peut prendre jusqu'à 5 minutes pour que la clé soit active). Ajoutez également

onFail={error => console.error(error)}

au composant pour voir l'erreur api.

Si la clé fonctionne, vous pouvez essayer de restreindre l'accès.


1 commentaires

le quota AP gratuit a des limites sur le nombre de requêtes et le taux par seconde mais devrait être suffisant pour les tests.



0
votes

dans mon cas, react-native-google-places-autocomplete utilise FlatList et depuis que je l'ai enveloppé ScrollView . Les résultats n'apparaissaient pas. La suppression du ScrollView parent l' ScrollView résolu


0 commentaires