如何在react.js中将三个firebase集合中的数据提取到一个表中



我在cloud firestore中有三个不同的集合,我正在这些集合中存储我的反馈应用程序数据。一开始,我将学生数据存储到学生集合中,然后将学生的反馈存储在反馈集合中,最后将一些额外信息存储在细节集合中。现在我正在获取管理面板表中的所有数据。我已经成功地获取了详细信息收集数据,但没有得到如何在表中获取其他信息的逻辑,以及我将如何将数据相互关联?

import React, { useEffect, useState } from 'react';
import MaterialTable from 'material-table';
import AdminNavbar from '../../layout/AdminNavbar';
import firebase from '../../../config/fbConfig';
const Dashboard = (props) => {
const [tableData, settableData] = useState();
useEffect(() => {
getdata();
});
console.log(props);
async function getdata() {
const ref = firebase
.firestore()
.collection("details");
const snapshot = await ref.get();
settableData(snapshot.docs.map(doc=>doc.data()))     
}
const tableCol = [
{
title: "Course expectations",
field: "course_delivering_on_your_expectations"
},
{
title: "Oppurtunities",
field: "enough_opportunities_to_apply"
},
{
title: "Explanation Clear",
field: "explanation_of_concepts_clear"
},
{
title: "Knowledge",
field: "instructor_knowledgeable_about_the_topics"
},
{
title: "Engaging",
field: "instructors_delivery_engaging"
},
{
title: "Learning",
field: "learning_valuable_information"
}
];

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;

由于Firestore查询很浅,因此无法在单个查询中同时获取3个集合。

您可以使用集合组来实现您的目标。如果集合具有不同的ID,则需要多次读取并在客户端连接它们。

最新更新