FireStoreから値を取得方法　サブcollection取得編　(Vue, Nuxt)

サブcollectionの取得

業務でFirebaseのFirestoreを利用しています。

DB作成の段階でcollectionにサブcollectionもたせた方が簡単じゃね？となり今回DB側にサブcollectionを作成しました。

ところがどっこい、サブcollection取得で躓いだので備忘録として下記にカキコ

import {
  getFirestore,
  collection,
  query,
  getDocs,
} from 'firebase/firestore'

const getSubCollection = async () => {
    const db = getFirestore()
    const q = query(collection(db, 'mainCollection名'))
    const querySnapshot = await getDocs(q)
    // まずmaincollectionのdocumentIdを取得
    const docId = querySnapshot.docs[0].id

    const subQ = query(
      collection(db, 'mainCollection名', docId, 'subCollection名')
    )
    const subQuery = await getDocs(subQ)
    const subInfo = subQuery.docs.map((doc) => {
      return doc.data()
    })

    if (subInfo.length) {
      return subInfo[0]
    }
    return null
  }

サブcollectionの取得はドキュメントidが必要

決め打ちのコレクション名記載すればとれるかなと思っていたのですが、
サブcollectionを取得するには、紐づいているメインcollectionのドキュメントidが必要でした。上記でも記載あるけど下記に再度書いときます。

 const subQ = query(
      collection(db, 'mainCollection名', docId, 'subCollection名')
    )

為になりましたとさ。