javascript 如何从Firestore接收数据并将其Map到元素？

8yparm6h 于 2023-01-11 发布在 Java

关注(0)|答案(1)|浏览(130)

我创建了一个电子商务网站，可以将数据推送到firestore，但现在我想创建一个订单历史页面，并将接收到的数据Map到“Product”元素中。
我能够将数据显示到控制台，但无法Map。

const [{basket, user }, dispatch] = useStateValue();
    const [order, setOrder] = useState([]);

    useEffect(()=>{
      if (user){
        const orderData = onSnapshot(doc(db, "orders", user?.email), (doc) => {
        console.log("Current data: ", doc.data().order);
    });
      }else{
        setOrder([])
      }
    }, [user])

Map-

<div className='orderPageProduct'>
  {order?.map(order => (
    <OrderProduct order={order} />
  ))}
</div>

我只是个初学者，不知道该怎么做。

JavaScript

来源：https://stackoverflow.com/questions/75068705/how-to-receive-data-from-firestore-and-map-it-to-an-element

1条答案

按热度按时间

5uzkadbs1#

看起来您忘记在onSnapshot处理程序中调用setOrders，这意味着您的状态从未更新，因此您的UI从未使用来自数据库的订单重新呈现。
为了解决这一具体问题：

useEffect(() => {
  if (user) {
    onSnapshot(doc(db, "orders", user?.email), (doc) => {
      const orderData = doc.data().order; // 👈
      setOrder([orderData]); // 👈
    });
  } else {
    setOrder([])
  }
}, [user])

赞(0）回复(0）举报 2023-01-11

我来回答

javascript 如何从Firestore接收数据并将其Map到元素？

1条答案

相关问题

热门标签

最新问答