如何在 React 中将此代码从 Firebase Firestore v8 转换为 Firebase Firestore v9 Modular答案

【问题标题】：How do I convert this code from Firebase Firestore v8 to Firebase Firestore v9 Modular in React如何在 React 中将此代码从 Firebase Firestore v8 转换为 Firebase Firestore v9 Modular
【发布时间】：2021-11-10 23:37:07
【问题描述】：

我无法在 reactjs 中将此代码从 firebase v8 更改为模块化版本的 firebase v9。

const uploadFirestore = useCallback(async() => {
  await db.collection('users').doc(res.user.uid).collection('tareas').add({
    name: 'Test Task',
    fecha: Date.now()
  })
})

我想将其转换为 firebase 9 模块化，同时在集合中传递 userUid。

我正在尝试这样做：

import React, { useCallback } from 'react'
import { db } from "./firebase"
import { collection, doc, addDoc } from "firebase/firestore"; 

function App(props) {
  const uploadFirestore = useCallback(async() => {
    await addDoc(doc(db, 'users', props.user.uid, 'tareas'), {
      name: 'Test Task',
      fecha: Date.now()
    })
  })
  
  return (
    <div>
      <button onClick={uploadFirestore}>
        Upload
      </button>
    </div>
  )
}

export default App

这是我的 firebase.js：

import { initializeApp } from "firebase/app";
import { getFirestore } from 'firebase/firestore';


const firebaseApp = initializeApp({
    hidden api uwu
  });


const db = getFirestore(firebaseApp);

export { db }

但它抛出一个：

TypeError: n.indexOf 不是函数

有什么帮助吗？

【问题讨论】：

请编辑问题以显示您尝试过的方法无法按您预期的方式工作以及任何错误。从 documentation 开始，它显示了可以使用的示例。
@DougStevenson 我更新了问题，看看 uwu

标签： javascript reactjs firebase google-cloud-firestore react-hooks

【解决方案1】：

这看起来不对：

addDoc(doc(db, 'users', props.user.uid, 'tareas'), ...

您正在尝试将文档添加到文档中，这有两个问题：

文档只能添加到集合中，不能添加到其他文档中。
您正在将集合 (tareas) 的路径传递给对 doc 的调用。

你想要的是：

addDoc(collection(db, 'users', props.user.uid, 'tareas'), ...

【讨论】：