получать долгую от Google Map в реагировать родной - PullRequest
0 голосов
/ 08 февраля 2019

Я не могу получить лат из API карты Google, используя React Native .

Я использую это расширение для автоматического завершения реагировать-нативно-Google-места-автозаполнение

Я создаю приложение Rideshare, для этого я должен получить местоположение забрать и отпустить пользователя.Приложив много усилий, я получаю Auto-Complete Work.

Теперь проблема в том, что мне нужны широта и долгота выбранных локаций.Я пытался, но не могу.

Нужна помощь, спасибо.

<GooglePlacesAutocomplete
  placeholder='Enter Location'
  minLength={2}
  autoFocus={false}
  returnKeyType={'default'}
  fetchDetails={true}
  onPress={(data, details = null) => { 
// I tried this One 
// Tried to get the reponce from API HERE

  console.log(data, details);
}}
  styles={{
    textInputContainer: {
      backgroundColor: 'rgba(0,0,0,0)',
      borderTopWidth: 0,
      borderBottomWidth:0
    },
    textInput: {
      marginLeft: 0,
      marginRight: 0,
      height: 38,
      color: '#5d5d5d',
      fontSize: 16
    },
    predefinedPlacesDescription: {
      color: '#1faadb'
    },
  }}
  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'
  }}
  currentLocation={false}
/>

1 Ответ

0 голосов
/ 08 февраля 2019

Попробуйте это:

import RNGooglePlaces from 'react-native-google-places';

//constructor here

openSearchModal() {
  RNGooglePlaces.openAutocompleteModal()
  .then((place) => {
  // place represents user's selection from the
  // suggestions and it is a simplified Google Place object.
  console.log(place);  //here you will have lat and long
     this.setState({
       address: place,
     })
  })
  .catch(error => console.log("ERROR: " + error.message));  // error is a Javascript Error object
}

render() {
   <TouchableOpacity onPress={() => this.openSearchModal()}>
       <Text>Map</Text>
   </TouchableOpacity>
}
...