es.davy.ai

Preguntas y respuestas de programación confiables

¿Tienes una pregunta?

Si tienes alguna pregunta, puedes hacerla a continuación o ingresar lo que estás buscando.

¿Cómo accedo al valor devuelto por la promesa de Firestore?

Estoy tratando de acceder a lo que devuelve secondSnapshot.data(), pero tengo un problema, como se describe en los comentarios de abajo. Intenté crear una función asincrónica, pero no funcionó. ¿Alguna idea de qué está saliendo mal? Por favor, consulte los 2 comentarios.

  useEffect(() => {
    firestore.collection(`comentarios`).onSnapshot((snapshot) => {
      const posts = snapshot.docs
        .map((doc) => {
          const address = doc.data().comments?.map((comment) => {
            comment.get().then((secondSnapshot) => {
              console.log("snapshot", secondSnapshot.data());

              #VEO LO QUE ESPERO VER

              return secondSnapshot.data();
            });
          });
          console.log(address) #¡ESTO DEVUELVE INDEFINIDO POR ALGUNA RAZÓN?

          return {
            username: doc.data().username,
            date: doc.data().date.seconds,
            text: doc.data().text,
            votes: doc.data().votes,
            comments: [],
          };
        });
      props.setComments(posts);
    });
  }, [location]);
Tags:  , , , ,

Answer

  1. Avatar for davy.ai

    Parece que el problema está en que address no está definido porque no se está devolviendo nada. Esto se debe a que comment.get() devuelve una promesa, y el valor devuelto por .map() en este caso no se está esperando antes de ser devuelto. Para solucionarlo, puede usar Promise.all() para esperar a que todas las promesas se resuelvan antes de devolver la matriz address. Aquí hay un ejemplo de cómo se puede hacer:

    useEffect(() => {
      firestore.collection(`comments`).onSnapshot((snapshot) => {
        const posts = snapshot.docs.map(async (doc) => {
          const address = await Promise.all(
            doc.data().comments?.map((comment) => {
              return comment.get().then((secondSnapshot) => {
                console.log("snapshot", secondSnapshot.data());
                return secondSnapshot.data();
              });
            })
          );
          console.log(address);
    
          return {
            username: doc.data().username,
            date: doc.data().date.seconds,
            text: doc.data().text,
            votes: doc.data().votes,
            comments: address,
          };
        });
        props.setComments(posts);
      });
    }, [location]);
    

    Al usar Promise.all() para esperar a que todas las promesas se resuelvan, nos aseguramos de que la matriz address esté poblada con los datos recuperados de los documentos de comment. Tenga en cuenta que también necesitamos marcar la función map() como async para poder usar await dentro de ella.

Comments are closed.