当前位置在 react-native-google-places-autocomplete.

Question

选择当前位置时，api 会获取位置，但列表似乎没有填充/显示位置。 但是，选中后，它会反向地理编码并在控制台中打印详细信息。

但是，它不会设置为文本输入。

不确定我错过了什么

这就是屏幕的外观

代码如下所示

<GooglePlacesAutocomplete
placeholder='Deliver To'
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 || row.vicinity} // 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: '',
language: 'en', // language of the results
types: 'geocode', // default: 'geocode'
components: 'country:au',
}}
styles={{
textInputContainer: {
width: '100%',
backgroundColor: 'rgba(0,0,0,0)',
borderLeftWidth: 0.5,
borderRightWidth: 0.5,
},
textInput: {
fontFamily: "AvenirMedium",
fontSize: 17,
color: "#000",
backgroundColor: 'rgba(0,0,0,0)',
},
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={'GoogleReverseGeocoding'} // Which API to use: GoogleReverseGeocoding or GooglePlacesSearch
GoogleReverseGeocodingQuery={{
// available options for GoogleReverseGeocoding API : https://developers.google.com/maps/documentation/geocoding/intro
key: '',
language: 'en',
}}
/>

Answer 1

1. Just add textInputProps={{ onBlur: () => {} }} in <GooglePlacesAutocomplete />
Ex.
2. comment   // renderDescription={(row) => row.description}
`<View>
<ScrollView keyboardShouldPersistTaps="handled">
<View keyboardShouldPersistTaps="handled" >
<GooglePlacesAutocomplete
currentLocation={true}
placeholder='Enter your location'
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
keyboardAppearance={'light'} // Can be left out for default keyboardAppearance https://facebook.github.io/react-native/docs/textinput.html#keyboardappearance
listViewDisplayed='true'    // true/false/undefined
fetchDetails={true}
//renderDescription={row => row.description || row.formatted_address || row.name}
// renderDescription={(row) => row.description} // custom description render
//components='country:ind'
onPress={(data, details = null) => {
//let address = details.formatted_address.split(', ');
console.log("DATAA", data);
console.log("details", details.name + ", " + details.formatted_address);
if (data && details) {
this.setState({
disLocation: data.description ? data.description : details.name + ", " + details.formatted_address,
lat: details.geometry.location.lat ? details.geometry.location.lat : data.geometry.location.lat,
lng: details.geometry.location.lng ? details.geometry.location.lng : data.geometry.location.lng
})
}
}}
nearbyPlacesAPI='GooglePlacesSearch'
GooglePlacesSearchQuery={{
// available options for GooglePlacesSearch API : https://developers.google.com/places/web-service/search
rankby: 'distance',
// type: 'cafe'
}}
getDefaultValue={() => ''}
query={{
// available options: https://developers.google.com/places/web-service/autocomplete
key: 'AIzaSyCK9195rpO4FJm0UvXImv28Dek6iEBHI4k',
//language: 'fr', // language of the results
//types: 'address', // default: 'geocode'
//  components: 'country:ca' // added  manually
}}
styles={{
textInputContainer: {
width: '100%'
},
description: {
fontWeight: 'bold'
},
predefinedPlacesDescription: {
color: '#1faadb'
}
}}
textInputProps={{ onBlur: () => {} }}
//GooglePlacesDetailsQuery={{ fields: 'formatted_address' }}
GooglePlacesDetailsQuery={{ fields: ['geometry', 'formatted_address'] }}
debounce={300} // debounce the requests in ms. Set to 0 to remove debounce. By default 0ms.
/>
</View>
</ScrollView>
</View>`
`https://github.com/FaridSafi/react-native-google-places-autocomplete/issues/496#issuecomment-606272340`

Answer 2

請刪除道具「renderDescription」。它会正常工作。我也收到了这个错误。我浪费了很多时间。最后我找到了这个解决方案。