React项目Firebase Firestore v8迁移至v9模块化版本及报错解决

• addDoc API 要求传入的第一个参数为集合（Collection）引用，用于指定新文档要存入的集合位置
• 你代码中使用doc()生成的是文档（Document）引用，和addDoc要求的参数类型不匹配，因此抛出类型错误

直接替换uploadFirestore方法内的代码，将doc改为collection即可，同时补充useCallback的依赖数组避免闭包问题和React警告，修改后的完整代码如下：

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

function App(props) {
  const uploadFirestore = useCallback(async() => {
    // collection方法按顺序传入路径段即可生成对应层级的子集合引用
    await addDoc(collection(db, 'users', props.user.uid, 'tareas'), {
      name: 'Test Task',
      fecha: Date.now()
    })
  }, [props.user.uid]) 
  
  return (
    <div>
      <button onClick={uploadFirestore}>
        Upload
      </button>
    </div>
  )
}

export default App

内容的提问来源于stack exchange，提问作者iandev