从反应js中的firestore集合中获取数据

Question

我在 firestore 中有三个不同的数据库集合，我想将所有这些集合中的数据提取到我的管理面板表中。我必须从学生集合中获取学生的详细信息，从其他两个集合的反馈和详细信息中，我必须从详细信息集合中获取反馈和额外信息。首先，我正在获取我的学生收集数据，在我的管理表中，我必须获取反馈和表中的额外信息详细信息以及学生详细信息。 问题是我得到未定义的文档，在控制台中我得到没有找到文档！消息。

My code looks like this.

import React, { useEffect, useState } from 'react';
import MaterialTable from 'material-table';
import AdminNavbar from '../../layout/AdminNavbar';
import firebase from '../../../config/fbConfig';

const Dashboard = () => {
  const [tableData, settableData] = useState({
    id: "",
    name: "",
    course: "",
    email: "",
    phone: "",
    createdAt:""
  });

  useEffect(() => {
    getdata();
  }, []);

  async function getdata() {
    const ref = firebase
      .firestore()
      .collection("students").doc();
    ref.get().then((doc) => {
      const feedbackdata = doc.data();
      console.log(feedbackdata);
      if (doc.exists) {
        settableData({
          id: feedbackdata.id,
          name: feedbackdata.name,
          course: feedbackdata.course,
          email: feedbackdata.email,
          phone: feedbackdata.phone,
          createdAt: feedbackdata.createdAt
        });
      } else {
        console.log("No doc found!");
      }
    });
  }

  const tableCol = [
    {
      title: "Student ID",
      field: "id"
    },
    {
      title: "Name",
      field: "name"
    },
    {
      title: "Course",
      field: "course"
    },
    {
      title: "Email",
      field: "email"
    },
    {
      title: "Phone",
      field: "phone"
    },
    {
      title: "Submitted at",
      field: "createdAt"
    }
  ];
  
    return (
        <>
            <AdminNavbar />
            <div className="table-div">
                <MaterialTable
          title={"Student's Feedback"}
          data={tableData}
          columns={tableCol}
          
          options={{
            headerStyle: {
              backgroundColor: "#01579b",
              color: "#FFF"
            },
            exportButton: true,
            selection: false,
            search: true
          }}
          
        />
            </div>

        </>
    );
}

export default Dashboard;

Answer 1

您在此处对 Firestore 模块的使用不正确。请务必查看Firestore Docs 了解基本示例。

在您的代码中：

async function getdata() {
    const ref = firebase
      .firestore()
      .collection("students").doc(); // THIS IS INVALID

doc 方法需要获取文档的名称 - 您当前的使用不会告诉 Firestore 您想要哪个文档

// You want a particular document
    const ref = firebase
      .firestore()
      .collection("students").doc("<documentIdHere>");

// You want to get the list of documents in the student collection
    const ref = firebase
      .firestore()
      .collection("students");
    const snapshot = await ref.get();
    snapshot.forEach(doc => {
      console.log(doc.id, '=>', doc.data());
    });

更复杂的示例和用例可以在 Firestore 文档中找到，并且经常在其他 StackOverflow 问题中讨论。