javascript - 使用 Firestore 文档和集合数据
问题描述
我在 Firestore 中有一些具有以下集合结构的文档
_fl_meta_: Object { createdBy: "Kz5vTvzlmGhRCxqKuDhrvvANqPe2", docId: "76qlSYWItERvJVnLKSDt", env: "production", … }
author: "asd"
content: "last 1"
date: "2019-06-19T12:00:00-07:00"
id: "76qlSYWItERvJVnLKSDt"
imageDeck: Array [ {…} ]
order: 0
parentId: 0
status: "published"
summary: "last 1"
title: "last 1"
我试图遍历我的文档并将其集合数据呈现给我的组件,但我遇到了问题。
我的query
const db = firebase.firestore();
db
.collection('fl_content')
.where('_fl_meta_.schema', '==', 'blog')
.get()
.then(querySnapshot => {
querySnapshot.forEach(doc => {
console.log(doc.data());
// let results = Object.keys(doc.data()).map(function (key) {
// return [String(key), doc.data()[key]];
// })
// this.setState({ cards: results });
});
})
.catch(error => {
console.log("Error getting documents: ", error);
});
该查询从 输出上述集合firestore
。谢谢您的帮助
解决方案
获取querySnapshot
并映射它以生成包含您的文档的对象数组。
const querySnapshot = firebase.firestore().collection('fl_content')
.where('_fl_meta_.schema', '==', 'blog').get()
.then((querySnapshot) => {
// The following line will result in an array of objects (each object is your document data)
const yourDocuments = querySnapshot.docs.map((doc) => doc.data());
this.setState({cards: yourDocuments});
})
.catch((error) => {
console.log(error);
});
然后您可以执行以下操作:
// INSIDE YOUR RENDER METHOD
const cardItems = this.state.cards.map((item,index) =>
<CardComponent key={index}>
{item.name} // Here you can access and display the fields of your documents
</CardComponent>
);
return(
<SomeContainerComponent>
{cardItems}
</SomeContainerComponent>
);
推荐阅读
- php - 基于关系 Laravel 5.8 和 Eloquent 更新数据库表
- c++ - 从 http 流(在 boost::beast 中)读取和写入的要求是什么?
- python - 如何在 Python 中使用 matplotlib 绘制数据?
- dimensional-modeling - DM 和层次结构 - 未来使用的维度
- python-3.x - ls -l 的打印输出 | 奇怪的东西
- c++ - 如何使用 CMake 使混合 C/C++ 项目工作
- angular - 使用条纹支付按钮时无法关闭角度材质对话框
- java - java.lang.ClassCastException:java.util.LinkedHashMap 无法转换为 com.mx.model.usermgmt.UserDetails
- c++ - 面向对象编程 - 位域私有结构的公共参考
- python-3.x - 在 Python 中的列表中创建连续项目的矩阵