Rev 473 | 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(input) {autoComplete = new window.google.maps.places.Autocomplete(input,{ types: ['(cities)'] })autoComplete.setFields(['address_components','formatted_address','geometry',])autoComplete.addListener('place_changed', handlePlaceSelect)}function handlePlaceSelect() {const addressObject = autoComplete.getPlace()const query = addressObject.formatted_addressconst address = {}if (query) {setError(null)addresObject.address_components?.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: query })}else {setError('Ha ocurrido un error')}}useEffect(() => {handleScriptLoad(inputRef)}, [inputRef])return { ...addresObject, error }}export default useLocationAutocomplete