javascript - I am trying to access a specific row but I am having an error in Vue

Question

The error is Uncaught TypeError: snapShotChnaged.forEach is not a function. I need a specific row, that's why I am using the doc.

getAllDonations() {
    firestore
      .collection('donations')
      .doc(this.$route.params.id)
      .onSnapshot((snapShotChnaged) => {
          this.donations = []
          snapShotChnaged.forEach((donationDoc) => {
              this.donations.push({
                  id: donationDoc.id,
                  name: donationDoc.data().name,
                  surname: donationDoc.data().surname,
                  class: donationDoc.data().class,
                  amount: donationDoc.data().amount
              })
          });
      });
},

Answer 1

You are calling onSnapshot() on a DocumentReference: (firestore.collection('donations').doc()) and therefore there is no forEach() method for the DocumentSnapshot (i.e. your snapShotChnaged object).

One would use forEach() on the querySnapshot returned by onSnapshot() for CollectionReferences.

You need to do as follows:

firestore
  .collection('donations')
  .doc(this.$route.params.id)
     .onSnapshot(doc => {
        const docData = doc.data());
        // ....
  });