Javascript TypeError： doc 不是 addSubCollectionDocument 中的函数

我试图将新文档添加到文档中不存在的子集合(solutionsCollection/docID/commentsSubCollection).

类型

将新文档添加到comments个子集合的代码:

  const addSubCollectionDocument = async (docID, doc) => {
    dispatch({ type: "IS_PENDING" })
    try {
      const docRef = doc(db, c, docID)
      const colRef = collection(docRef, "comments")
      const addedDocument = await addDoc(colRef, doc)
      dispatchIfNotCancelled({ type: "ADDED_DOCUMENT", payload: addedDocument })
      return addedDocument
    } catch (error) {
      console.log(error)
      dispatchIfNotCancelled({ type: "ERROR", payload: error })
      return null
    }
  }

handleSubmit函数:

const handleSubmit = async (e) => {
    e.preventDefault()

    try {
      const commentToAdd = {
        id: Math.floor(Math.random() * 10000),
        content: newComment.trim(),
        reactions: [],
        user: {
          userID: user.uid,
          avatarURL: user.photoURL,
          displayName: user.displayName,
          username: user.reloadUserInfo.screenName,
        },
        replies: [],
        createdAt: new Date(),
      }
      await addSubCollectionDocument(id, commentToAdd)
      setNewComment("")
      if (response) {
        console.log(response.error)
      }
    } catch (error) {
      console.log(error)
    }
  }

useFirestore钩子代码:

import { useEffect, useReducer, useState } from "react"
import {
  addDoc,
  collection,
  deleteDoc,
  doc,
  serverTimestamp,
  updateDoc,
} from "firebase/firestore"

import { db } from "../firebase/config"

export const useFirestore = (c) => {
  const [response, dispatch] = useReducer(firestoreReducer, initialState)
  const [isCancelled, setIsCancelled] = useState(false)

  // only dispatch is not cancelled
  const dispatchIfNotCancelled = (action) => {
    if (!isCancelled) {
      dispatch(action)
    }
  }

  // add a document
  const addDocument = async (doc) => {
    dispatch({ type: "IS_PENDING" })

    try {
      const createdAt = serverTimestamp()
      const addedDocument = await addDoc(collection(db, c), {
        ...doc,
        createdAt,
      })
      dispatchIfNotCancelled({ type: "ADDED_DOCUMENT", payload: addedDocument })
    } catch (err) {
      dispatchIfNotCancelled({ type: "ERROR", payload: err.message })
    }
  }

  // Add document to sub collection
  const addSubCollectionDocument = async (docID, doc) => {
    dispatch({ type: "IS_PENDING" })
    try {
      const docRef = doc(db, c, docID)
      const colRef = collection(docRef, "comments")
      const addedDocument = await addDoc(colRef, doc)
      dispatchIfNotCancelled({ type: "ADDED_DOCUMENT", payload: addedDocument })
      return addedDocument
    } catch (error) {
      console.log(error)
      dispatchIfNotCancelled({ type: "ERROR", payload: error })
      return null
    }
  }


  useEffect(() => {
    return () => setIsCancelled(true)
  }, [])

  return {
    addDocument,
    addSubCollectionDocument,
    response,
  }
}

我要导入addSubCollectionDocument个钩子的文件:

import { useFirestore } from "../../hooks/useFirestore"
import { useAuthContext } from "../../hooks/useAuthContext"

const SolutionComments = ({ solution }) => {
  const [newComment, setNewComment] = useState("")
  const { user } = useAuthContext()
  const { id } = useParams()
  const { addSubCollectionDocument, response } = useFirestore("solutions")

  const handleSubmit = async (e) => {
    e.preventDefault()

    try {
      const commentToAdd = {
        id: Math.floor(Math.random() * 10000),
        content: newComment.trim(),
        reactions: [],
        user: {
          userID: user.uid,
          avatarURL: user.photoURL,
          displayName: user.displayName,
          username: user.reloadUserInfo.screenName,
        },
        replies: [],
        createdAt: new Date(),
      }
      await addSubCollectionDocument(id, commentToAdd)
      setNewComment("")
      if (response) {
        console.log(response.error)
      }
    } catch (error) {
      console.log(error)
    }
  }

  return (...)}

包裹json要点:

Firebase规则:

rules_version = '2';
service cloud.firestore {
  match /databases/{database}/documents {
        match /challenges/{challenge}{
        allow read: if true
    }
    match /resources/{resource}{
        allow read: if true
    }
    match /solutions/{solution}{
      allow read: if true
      allow create: if request.auth.uid != null;
      allow update, delete: if request.auth.uid == resource.data.userID;
    }
    match /users/{userId}{
        allow create: if true
      allow read: if true
    }
  }
}