Tintef / react-google-places-autocomplete

React Google Places Autocomplete input -- fully customizable
https://tintef.github.io/react-google-places-autocomplete
MIT License
376 stars 161 forks source link

OnClick Freeze on Android Only ( on expoGo works ) #311

Closed ModaxDev closed 1 year ago

ModaxDev commented 1 year ago

Hey guys,

When i wanted to select a result, I can't do anything anymore, no crash just everything is frozen Its work perfectly on expoGo platform ( IOS - Android ) On IOS prod all is good On Android : Freeze

Here is my code :

<GooglePlacesAutocomplete
                                styles={{ container: {
                                        borderWidth:1,
                                        borderRadius:12,
                                        overflow:'hidden'
                                    },
                                    poweredContainer: {display:'none'}
                                }}
                                placeholder='Rechercher votre adresse'
                                onFail={(error) => console.error(error)}
                                keyboardShouldPersistTaps={'handled'}
                                keepResultsAfterBlur={true}
                                minLength={1} // minimum length of text to search
                                listViewDisplayed={false}
                                // true/false/undefined
                                fetchDetails={true}
                                renderDescription={row => row.description} // custom description render
                                onPress={(data, details = null) => {
                                    setLocation(details.geometry.location);
                                    setAddress(details.name);
                                    setPostalCode(details.address_components[details.address_components.length - 1].long_name);
                                    setCity(details.address_components[details.address_components.length - 5].long_name);
                                }}
                                query={{
                                    key: "",
                                    language: 'en', // language of the results
                                    // types: '(cities)' // default: 'geocode'
                                }}
                                nearbyPlacesAPI='GooglePlacesSearch' // Which API to use: GoogleReverseGeocoding or GooglePlacesSearch
                                debounce={200}
                            />)}
                            {!route?.params?.delivery && (<GooglePlacesAutocomplete
                                styles={{ container: {
                                        borderWidth:1,
                                        borderRadius:12,
                                        overflow:'hidden'
                                    },
                                    poweredContainer: {display:'none'}
                                }}
                                placeholder='Rechercher votre adresse'
                                onFail={(error) => console.error(error)}
                                // styles={{   textInput: {
                                //         backgroundColor: '#f3f3f3',
                                //         height: 44,
                                //         borderRadius: 5,
                                //         paddingVertical: 5,
                                //         paddingHorizontal: 10,
                                //         fontSize: 15,
                                //         flex: 1,
                                //     },}}
                                keyboardShouldPersistTaps={'handled'}
                                listUnderlayColor={'transparent'}
                                keepResultsAfterBlur={true}
                                minLength={1} // minimum length of text to search
                                listViewDisplayed={false}
                                // true/false/undefined
                                fetchDetails={true}
                                renderDescription={row => row.description} // custom description render
                                onPress={(data, details = null) => {
                                    setLocation(details.geometry.location);

                                    setAddress(details.name);
                                    setPostalCode(details.address_components[details.address_components.length - 1].long_name);
                                    setCity(details.address_components[details.address_components.length - 5].long_name);
                                }}
                                query={{
                                    key: "",
                                    language: 'en', // language of the results
                                    // types: '(cities)' // default: 'geocode'
                                }}
                                nearbyPlacesAPI='GooglePlacesSearch' // Which API to use: GoogleReverseGeocoding or GooglePlacesSearch
                                debounce={200}
                            />
                        thanks
Tintef commented 1 year ago

@ModaxDev Please provide a repo to reproduce.

ModaxDev commented 1 year ago

After long days to debug this, it was the map component that was the cause, not the google place !

Tintef commented 1 year ago

Glad to hear that!