在提交时从react保存数据到firestore

Question

我正在从Angular转向react，但我很难将一些数据保存到firestore中的集合中。

我想保存到的路径是:users/uid/pred

在Angular中，我这样做了，它可以工作:

savePredictions(data: any, uid: string) {
let v: any = Object.values(data);
v.forEach((x: any[]) => {
x.forEach((match) => {
this.db
.collection("users")
.doc(uid)
.collection("pred")
.doc(match.matchday)
.set({ [match.matchId]: match }, { merge: true });
});
});
}
}

在React中我这样做，它失败了:

const onSubmit = () => {
const userId = user?.uid;
const docRef = doc(db, "users", userId as string, "pred");
setDoc(docRef, predictions.fixtures);
console.log("SUBMIT TO FIREBASE:", predictions.fixtures);
};

身份验证正在工作，我可以从数据库接收数据，我也有数据在我的预测。要发送的fixture，它是一个数组。

谁能告诉我代码必须保存到这个集合称为'pred'?

Answer 1

我必须使用setDoc with doc，它创建一个新的doc with collection。我必须在forEach循环中运行它因为我的数据是一个数组所以每次迭代都必须是setDoc但是因为文档的名称改变了

"gameweek" + String(index + 1)

它创建一个新的文档，从而使我保存的数据在不同的文档和更好地查看在firestore数据库。

const onSubmit = () => {
setShowSave(false);
const userId = user?.uid;
predictions.fixtures[0].forEach((el: any, index: number) => {
setDoc(doc(db, "users", userId as string, "predx", "gameweek" + String(index + 1)), {
["gameweek" + String(index + 1)]: el,
});
});
};

Answer 2

可能有三个原因。

->版本差异-你在angular中使用的是版本8，而在react中使用的是版本9。firebase 8到firebase 9的所有语法变化

→您的集合名称应该是字符串格式(predict .fixtures)。

→你必须在setDoc中给出字段的值。setDoc的语法是setDoc(db， "collection-name"同一条)。