Tengo un componente funcional y en él tengo una función que recupera los artículos del carrito del usuario actual y quiero llamarlo cuando estoy abriendo un modal (que mostrará una vista previa de los artículos del carrito actual). Esto no sucede en el primer momento cuando abro el modal, sino solo si hago clic nuevamente en el modal en algún lugar.
Este es el código:
const handleOpen = () => { fetchUserCart(); console.log(currentUserCart); setOpen(true); }; const fetchUserCart = async () => { const q = query(collection(db, "users"), where("uid", "==", user?.uid)); const doc = await getDocs(q); const data = doc.docs[0].data(); setCurrentUserCart(data.cart); console.log(currentUserCart); }Debe esperar el final de fetchUserCart en handleOpen para registrar el resultado. En la primera iteración, no espera hasta que finalice la función de búsqueda para ir al siguiente paso console.log(currentUserCart);
Haz algo como esto:
const handleOpen = () => { fetchUserCart() .then(userCart => console.log(userCart)) }; const fetchUserCart = async() =>{ const q = query(collection(db, "users"), where("uid", "==", user?.uid)); const doc = await getDocs(q); const data = doc.docs[0].data(); setCurrentUserCart(data.cart); return (data.cart) }