TypeError：无法使用firebase读取未定义错误的属性“name”

jucafojl 于 12个月前发布在其他

关注(0)|答案(3)|浏览(129)

当我尝试运行我的应用程序时，出现以下错误

TypeError: Cannot read property 'name' of undefined

 26 | 
  27 |  useEffect(() => {
  28 |    if (roomId) {
> 29 |      db.collection("rooms")
     | ^  30 |        .doc(roomId)
  31 |        .onSnapshot((snapshot) => setRoomName(snapshot.data().name));
  32 |

字符串
我已经在我的firestore中定义了房间/消息和名称。我已经导入了firebase.js文件并添加了firebase配置。下面是我的js文件中的代码片段，它会抛出错误。

import db, { auth, provider } from "./firebase";
import firebase from "firebase";
import React, { useState, useEffect } from "react";

.... code ...
function Chat() {

  const { roomId } = useParams();
  const [roomName, setRoomName] = useState("");
  const [messages, setMessages] = useState([]);
  const [{ user }, dispatch] = useStateValue();

  useEffect(() => {
    if (roomId) {
      db.collection("rooms")
        .doc(roomId)
        .onSnapshot((snapshot) => setRoomName(snapshot.data().name));

    }
  }, [roomId]);

型
任何帮助都非常感谢。
编辑：这是数据库结构：x1c 0d1x

的

firebase

来源：https://stackoverflow.com/questions/64645387/typeerror-cannot-read-property-name-of-undefined-error-using-firebase

3条答案

按热度按时间

bvk5enib1#

该错误告诉您snapshot.data()返回undefined。如果您查询的位置（/rooms/{roomId}）没有文档，则可能会发生这种情况。在访问不存在的对象的属性之前，应检查是否存在这种情况。

.onSnapshot((snapshot) => {
    const data = snapshot.data();
    if (data) {
        setRoomName(data.name));
    }
    else {
        // decide what you want to do if there is no document
    }
}

字符串
由于我们看不到您的数据库，也看不到roomId的值，因此我们无法说明为什么会发生这种情况-您必须调试代码和数据才能弄清楚。

赞(0）回复(0）举报 12个月前

mklgxw1f2#

不要使用onSnapshot，尝试使用get方法

const getRoom = useCallback(async roomId => {
    if (roomId) {
      const room = await db.collection("rooms")
        .doc(roomId)
        .get();
      setRoomName(room.data().name);
    }
    setRoomName(null);
}, [])

useEffect(() => {
  getRoom(roomId)
}, [getRoom]);

字符串

赞(0）回复(0）举报 12个月前

ix0qys7i3#

我认为你得到了这个错误，而开发一个WhatsAppClone从聪明的程序员YouTube频道 *

解决方案：roomId值像**：ctV5lYvZU33hLtT4W3pB**一样带有冒号，但您必须将roomId传递给firebase以获取roomName。

useEffect(() => {
if (roomId) {
  db.collection("rooms")
    .doc(roomId.split(':')[1])   //ADD this change
    .onSnapshot((snapshot) => setRoomName(snapshot.data().name));
}
}, [roomId]);

字符串

赞(0）回复(0）举报 12个月前

我来回答

TypeError：无法使用firebase读取未定义错误的属性“name”

3条答案

相关问题

热门标签

最新问答