代码之家  ›  专栏  ›  技术社区  ›  mocode10

搜索时,react native google places undefined不是对象

  •  1
  • mocode10  · 技术社区  · 7 年前

    我可以显示自动完成输入无问题。但我一搜索它就崩溃了。

    Error message after searching

    这是我的位置选择器组件

    import React from 'react';
    
    import
    {
    View,
    Image,
    Text
    } from 'react-native';
    
    import { GooglePlacesAutocomplete } from 'react-native-google-places-autocomplete';
    
    const API_KEY = 'AIza____REMOVED____qDNtmo';
    
    const PlacePicker = (props) =>
    {
    return (
        <GooglePlacesAutocomplete
                    placeholder='Event Location'
                    minLength={2} // minimum length of text to search
                    autoFocus={false}
                    // 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.warn(data, details);
    
                    }}
                    textInputProps={{
                      onChangeText: (text) => { /*console.warn(text)*/ }
                    }}
                    getDefaultValue={() => ''}
    
                    query={{
                      // available options: https://developers.google.com/places/web-service/autocomplete
                      key: API_KEY,
                      language: 'en', // language of the results
                      types: 'geocode' // default: 'geocode'
                    }}
    
                    styles={{
                      textInputContainer: {
                        backgroundColor: 'rgba(0,0,0,0)',
                        borderTopWidth: 0,
                        borderBottomWidth:0,
                      },
                      description: {
                        fontWeight: 'bold',
                      },
                      textInput: {
                      marginLeft: 22,
                      marginRight: 0,
                      height: 38,
                      color: '#5d5d5d',
                      fontSize: 16,
                    },
                      predefinedPlacesDescription: {
                        color: '#1faadb'
                      }
                    }}
                    value={() => {}}
                    onChangeText={() => {}}
                    renderLeftButton={()  => <Text style={{ marginTop: 12, marginLeft:16, fontSize: 18 }}> Location </Text>}
                    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
                    debounce={200} // debounce the requests in ms. Set to 0 to remove debounce. By default 0ms.
    
                  />
    );
    }
    
    export default PlacePicker;
    

    我不知道为什么我不能让它工作。当我查看开发者API仪表板时,我可以看到API调用被发送到GooglePlacesAPI。

    0 回复  |  直到 7 年前