Map items of collection snapshot in Firebase Firestore

Question

Firebase Firestore Guides show how to iterate documents in a collection snapshot with forEach:

db.collection(\"cities\").get().then(function(que         


        

Answer 1

I have found that a better way to do this by using map and get your document id as well is as follows:

start with the object array I wish to update in your constructor:

    this.state = {
                allmystuffData: [
                {id: null,LO_Name: "name", LO_Birthday: {seconds: 0, nanoseconds: 0},    
                LO_Gender: "Gender", LO_Avatar: "https://someimage", LO_Type: "xxxxx"},],
    };

and in my function do the following

    const profile = firebase
        .firestore()
        .collection("users")
        .doc(user.uid)
        .collection("stuff")
        .get()
        .then( async (querySnapshot) => {
            console.log("number of stuff records for ",user.uid," record count is: ", 
            querySnapshot.size);
            const profile = await Promise.all(querySnapshot.docs.map( async (doc) => {
                const stuffData = doc.data()
                stuffData.id = doc.id
                condole.log("doc.id => ",doc.id)
                return stuffData
        }));
    
        this.setState({allmystuffData: profile});
        })
        .catch(function (error) {
            console.log("error getting stuff: ", error);
        })

In this example I read all the documents in the collection with querysnapshot the when mapping accross them. the promise.all ensures that all the records are returned before you render it to your screen. I add the document id to the "id" element of each object in the array returned, then I use setstate to replace my state array with the array returned from the query.