我想把用戶和它的資料連接起來。在我下面的代碼中，我可以從Firestore讀取資料，但當我試圖將資料顯示在表格中時，我只得到了用戶的一個帖子。盡管用戶在帖子集中有不止一個帖子。
在我的console.log('this is userData:', userData)中，它顯示了
this is userData: [{...}]和this is userData: (2) [{...}, {...}]
在我的{userData.map((post, index) => {console.log(index, post)})}中，所有帖子的索引都是0。
也許我在這里遺漏了什么，我如何才能解決這個問題？
export default function App （）{
const [userData, setUserData] = useState([] )。
console.log('this is userData:'/span>, userData)。
useEffect(() => {
db.collection（'user'）.doc（'idUser'）。 onSnapshot((documentSnaphot) => {
const posts = [];
for (let id in documentSnaphot.data().userPosts) {
db.collection('post').doc（id）。 onSnapshot((docSnapshot) =>/span> {
posts.push(docSnapshot.data()。
setUserData(post)。
})
}
})
}, []);
return (
{userData.map((post, index) =>/span> {
console.log（index, post）。
})}
)
}
uj5u.com熱心網友回復：
我建議使用get來代替實時監聽器和async/await來使代碼更加清晰：
export default function App({userUid }) {
const [userData, setUserData] = useState（{}）。
const [post, setUserPosts] = useState([] )。
useEffect(() => {
db.collection("user"/span>)
.doc(userUid)
.onSnapshot((snap) =>/span> {
setUserData(snap.data()。
});
}, [userUid])。
useEffect(() => {
const posts = [];
for (let id in userData.userPosts) {
const postSnap = await db.collection("post") 。 doc（id）.get（）。
posts.push(postSnap.data())。
}
setUserPosts（posts）。
}, [userData])。
return (
<div>>
{posts.map((post, index) => {
console.log(index, post)。
})}
</div>
);
}
如果你需要一個實時監聽器，請告訴我，我將更新代碼，以便有一個監聽器。
轉載請註明出處，本文鏈接：https://www.uj5u.com/shujuku/320179.html
標籤：