我有一個學校專案,我必須第一次使用 Firestore,而老師也沒有真正知道如何去做。我制作了一個預算/訂閱應用程式,我想在其中創建串列型別的總訂閱量。我已經鏈接了我的 Firestore,它按預期運行。但我有 10 個帶有名稱、價格、日期和類別的訂閱者。但是我每分鐘讀取 8k 次??我最近嘗試了現收現付計劃,但如果我不盡快修復它,恐怕我會被收取一噸的費用。有誰能幫我解決這個緊急情況?第一個問題在這里,如果我做錯了,很抱歉。我正在使用反應。
Firestore 使用情況
我的收藏
這是我的 crud 組件的代碼:
import { useState, useEffect } from "react";
import { db } from "../firebase-config";
import { collection, getDocs, doc, deleteDoc } from "firebase/firestore";
import MoreVertIcon from "@mui/icons-material/MoreVert";
import { Button } from "react-bootstrap";
export default function Crud() {
const [subs, setSubs] = useState([]);
const subsCollectionRef = collection(db, "subs");
const deleteSubs = async (id) => {
const subsDoc = doc(db, "subs", id);
await deleteDoc(subsDoc);
};
useEffect(() => {
const getSubs = async () => {
const data = await getDocs(subsCollectionRef);
setSubs(data.docs.map((doc) => ({ ...doc.data(), id: doc.id })));
};
getSubs();
}, [subsCollectionRef]);
return (
<div className="App">
{subs.map((subs) => {
return (
<div className="subField">
{""}
<div className="field">
<h1>
<Button sx={{ fontSize: 25 }} style={{ backgroundColor: "rgba(255, 255, 255, 0.888)", border: "none"}}
onClick={() => {
deleteSubs(subs.id);
}}
<MoreVertIcon style={{ color: "black"}} ></MoreVertIcon>
</Button>{" "}
 {subs.name}
</h1>
<h1>DKK F?rste betaling: {subs.payment} <br></br> Pris: {subs.price} DKK</h1>
</div>
</div>
);
})}
</div>
);
} `
我如何正確減少它?我覺得我已經閱讀了很多關于如何減少它的文章,但我還沒有想出任何我完全理解的東西。而且至少對于我的具體例子來說不是。鏈接到Github
uj5u.com熱心網友回復:
您不需要添加CollectionReference到依賴項陣列。如果您在getSubs函式中記錄某些內容,那么您可以看到它多次從 Firestore 獲取資料。嘗試:
useEffect(() => {
const getSubs = async () => {
console.log('getSubs function running');
const data = await getDocs(subsCollectionRef);
setSubs(data.docs.map((doc) => ({ ...doc.data(), id: doc.id })));
};
getSubs();
}, []); // <-- remove subsCollectionRef
轉載請註明出處,本文鏈接:https://www.uj5u.com/qukuanlian/519714.html
標籤:Google Cloud Collective 反应火力基地谷歌云火库反应钩子
