Firestore onSnapshot throws error: "doc is not a function"

jeff3546 0
Viewed 34

In a Vue/Firebase app, I have a nested onSnapshot attached to a single document. I get the following error:

enter image description here

This is my code:


import { onSnapshot, query, collection, collectionGroup, getDocs, where, doc, updateDoc, getDoc, orderBy, addDoc, limit } from 'firebase/firestore'
import { getAuth, signInWithEmailAndPassword, createUserWithEmailAndPassword, onAuthStateChanged, signOut } from "firebase/auth";

import { db } from "../firebase/index";
import store from "../store/index";

//Get loggedin user data
const auth = getAuth();
onAuthStateChanged(auth, (user) => {
    if (user) {

        onSnapshot(qUserData, (snapshot) => {
            store.state.userData = {}
            snapshot.docs.forEach((doc) => {
                let user = doc.data()
                user.id = doc.id
                store.state.userData = user

                //This is what throws the error
                const teamDocRef = doc(db, "teams", user.teamid)
                onSnapshot(teamDocRef, (docSnapshot) => {
                    console.log("Current data: ", docSnapshot.data());
                });
            })
        })
    }
})

Thanks for any help!

google-cloud-firestore firebase javascript
1 Answers

Use a different naming convention for your snapshots as you are probably in conflict with the doc variable you import on the first line.

import { onSnapshot, query, collection, collectionGroup, getDocs, where, doc, updateDoc, getDoc, orderBy, addDoc, limit } from 'firebase/firestore'

Instead of...

snapshot.docs.forEach((doc) => {
    let user = doc.data()
    user.id = doc.id
    store.state.userData = user

    //This is what throws the error
    const teamDocRef = doc(db, "teams", user.teamid)
    onSnapshot(teamDocRef, (docSnapshot) => {
        console.log("Current data: ", docSnapshot.data());
    });
})

Use...

snapshot.docs.forEach((docSnapshot) => {
    let user = docSnapshot.data()
    user.id = docSnapshot.id
    store.state.userData = user

    //This is what throws the error
    const teamDocRef = doc(db, "teams", user.teamid)
    onSnapshot(teamDocRef, (teamDocSnapshot) => {
      console.log("Current data: ", teamDocSnapshot.data());
    });
})
Alex Gill0
Related