Rev 476 | Rev 481 | Ir a la última revisión | Autoría | Comparar con el anterior | Ultima modificación | Ver Log |
import { useState, useEffect } from 'react'const useLocationAutocomplete = (inputRef) => {const [addresObject, setAddressObject] = useState({})const [error, setError] = useState(null)let autoCompletefunction handleScriptLoad(autoCompleteRef) {autoComplete = new window.google.maps.places.Autocomplete(autoCompleteRef,{ types: ['(cities)'] })autoComplete.setFields(['address_components','formatted_address','geometry',])autoComplete.addListener('place_changed', () => handlePlaceSelect())}function handlePlaceSelect() {setAddressObject({})const addressPlace = autoComplete.getPlace()const formattedAddress = addressPlace.formatted_addressconst addressComponents = [...addressPlace.address_components,{latitude: addressPlace.geometry.location.lat(),longitude: addressPlace.geometry.location.lng(),types: ['geometry'],},]const address = {}if (formattedAddress) {setError(null)addressComponents?.map((address_component) => {const address_component_name = address_component.long_nameconst address_component_type = address_component.types[0]switch (address_component_type) {case 'route':address['address1'] = address_component_namebreakcase 'sublocality':address['address2'] = address_component_namebreakcase 'locality':address['city1'] = address_component_namebreakcase 'administrative_area_level_2':address['city2'] = address_component_namebreakcase 'administrative_area_level_1':address['state'] = address_component_namebreakcase 'country':address['country'] = address_component_namebreakcase 'postal_code':address['postal_code'] = address_component_namebreakcase 'geometry':address['latitude'] = address_component.latitudeaddress['longitude'] = address_component.longitudebreakdefault:break}})setAddressObject({ ...address, formatted_address: formattedAddress })} else {setError('Ha ocurrido un error')}}useEffect(() => {if (inputRef) {handleScriptLoad(inputRef)}}, [inputRef])return { address: addresObject, error }}export default useLocationAutocomplete