当我想在node.js html中显示来自firestore的数据时,我在这2个代码上遇到了错误:productName.textContent = doc.data().name;和 productPrice.textContent = doc.data().price;
const myProducts = db.collection('products');
const productsContainer = document.querySelector('#groceries');
function renderProduct(doc) {
const docFrag = document.createDocumentFragment();
let article = document.createElement('article');
let productName = document.createElement('h4');
let productPrice = document.createElement('p');
article.setAttribute('id', doc.id);
productName.textContent = doc.data().name;
productPrice.textContent = doc.data().price;
docFrag.appendChild(productName);
docFrag.appendChild(productPrice);
article.appendChild(docFrag);
productsContainer.appendChild(article);
}
myProducts.onSnapshot(products => {
products.forEach(doc => {
products = doc.data();
console.log(products);
renderProduct(products);
});
});
class shop extends React.Component {
render() {
return (
<div className="app-wrapper">
<ContainerHeader match={this.props.match} title={<IntlMessages id="appModule.contactSupport"/>}/>
<div className="d-flex justify-content-center">
<div id="groceries"></div>
</div>
</div>
);
}
}
最佳答案
看起来您正在传递数据,而不是对 renderProduct
的文档引用,因此您只需直接访问 Prop 即可:
function renderProduct(data) {
// ...
article.setAttribute('id', data.id);
productName.textContent = data.name;
productPrice.textContent = data.price;
// ...
关于javascript - Firestore 未捕获类型错误 : doc. 数据不是函数,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/58733362/