reactjs - 如何在firebase数据库Reactjs中显示最新项目？

Question

这是我的火力基地功能：-

getAllProducts = () => {
    // console.log('getAllProducts')
    return new Promise((resolve, reject) => {
      this.database
        .ref(`products`)
        .once('value')
        .then(async (snapshot) => {
          if (snapshot.exists()) {
            let allProducts = Object.values(snapshot.val())
            let allKeys = Object.keys(snapshot.val())
            await Promise.all(
              allProducts.map(async (item, index) => {
                let items = item
                item = allKeys[index]
                let imageIds = items.images || []
                if (imageIds.length) {
                  if (items.coverImage) {
                    let index = imageIds.indexOf(items.coverImage)
                    var element = imageIds[index]
                    imageIds.splice(index, 0)
                    imageIds.splice(0, 0, element)
                  }
                  let imageUrls = await this.getImages(imageIds)
                  items.images = imageUrls
                }
                console.log(allProducts)
                return items
              }),
            )
            // console.log(allProducts)
            // allProducts = allProducts.filter((item) => item.isApproved === 1)
            resolve(allProducts)
          }
        })
    })
  }

这是我在页面中调用的地方：-

 // data from firebase

  useEffect(() => {
    DataBase.getAllProducts().then((response) => {
      console.log('Data fetched user effect', response)
      setIsCalling(true)
      setDataList(response)
    })
  }, [])

我的查询是当我添加一个产品时，它应该显示在表格顶部，这意味着每个最新项目都应该显示在顶部。

这是我的表格视图：- https://prnt.sc/1soylw5

标签： reactjsfirebasefirebase-realtime-database