Tengo una función en mi código de reacción así que...
const getLatLngFromAddress = async () => { try { const response = await Geocode.fromAddress(state.address.address1) const { lat, lng } = response.results[0].geometry.location; return { lat, lng } } catch (err) { console.log(err.message) } }
devuelve un objeto. Me gustaría establecer mi estado solo en una clave específica del objeto y no en el objeto en sí...
useEffect(async () => { setState({ ...state, address: { ...state.address, lat: await getLatLngFromAddress().lat, lng: await getLatLngFromAddress().lng } }) }, []);
useEffect anterior devuelve indefinido. ¿Hay alguna manera de hacer esto?
Debe leer las propiedades del valor resuelto de la promesa . Actualmente está tratando de leerlos desde la promesa misma y luego está await
esos valores undefined
.
lat: (await getLatLngFromAddress()).lat,
Sin embargo, está llamando a getLatLngFromAddress
dos veces. Almacene los valores en variables y luego reutilícelos en su lugar.
useEffect(async () => { const latlng = await getLatLngFromAddress() setState({ ...state, address: { ...state.address, ...latlng, } }) }, []);
Llame al método una vez y configúrelo en su estado:
useEffect(async () => { const {lat, lng} = await getLatLngFromAddress(); setState({ ...state, address: { ...state.address, lat: lat, lng: lng } }) }, []);
También puede difundir el resultado si no desea repetir todas las variables:
useEffect(async () => { const result = await getLatLngFromAddress(); setState({ ...state, address: { ...state.address, ...result } }) }, []);