javascript - FirebaseError : Function addDoc() called with invalid data. 不支持的字段值:未定义

Question

function Chat() {
    const [input, setInput] = useState("")
    const [seed, setSeed] = useState("")
    const {personid} = useParams()
    const [personname, setPersonname] = useState("")
    const [messages, setMessages] = useState([])
    const [{user}, dispatch] = useStateValue()

    useEffect(() => {
        if (personid) {
        db.collection("people")
        .doc(personid)
        .onSnapshot((snapshot) => 
            setPersonname(snapshot.data().name));

        db.collection("people")
        .doc(personid)
        .collection("messages")
        .orderBy("timestamp", "asc")
        .onSnapshot((snapshot) => 
            setMessages(snapshot.docs.map(doc =>doc.data()))
            )
        }
    }, [personid])

    useEffect(() => {
        setSeed(Math.floor(Math.random()*1000))
    }, [personid])

    const sendmessage = (e) => {
        e.preventDefault()
        console.log("The input is ", input);
        
        db.collection("people").doc(personid).collection("messages").add({
            message: input,
            name: user.displayName,
            timestamp: firebase.firestore.FieldValue.serverTimestamp(),
        })

        setInput("")
    }

enter image description here

当我尝试运行该函数时，出现下图中的错误。我尝试使用 google cloud firestore 的时间戳作为替代方法，但我不知道这是什么问题。

Answer 1

错误消息表明您传递给 add() 的对象的 name 属性的值方法未定义。

此值为 user.displayName，正如您将在 doc 中看到的那样，您应该“确保在获取当前用户时 Auth 对象不处于中间状态——例如初始化”。

为此，您可以使用 onAuthStateChanged() 观察器并将所需的业务逻辑放入 if (user) {} block 中，如文档中所示，或者，您在执行 user.displayName 之前手动检查 firebase.auth().currentUser 是否为 null。