JavaScript：如何从Firebase获取完整产品对象并存入购物车数组

你的问题出在Object.keys(data).find(...)返回的是匹配的键名（比如product1），而非对应的产品对象。要拿到完整对象，你可以先把Firebase返回的对象转换成产品数组，再进行查找。

修改后的代码： #

// 购物车数组
let cart = []

// 添加到购物车函数
function addToCart(id){
  async function getAndAddToCart(){
    const baseURL = 'https://webstore-22fa4-default-rtdb.europe-west1.firebasedatabase.app/'
    const url = baseURL + 'Products.json'
    const response = await fetch(url)
    const data = await response.json()

    // 把Firebase返回的对象转换成产品数组
    const productsArray = Object.values(data)
    // 查找匹配id的产品对象
    const item = productsArray.find(product => product.id === id)
    
    if (item) { // 确保找到产品再加入购物车
      cart.push(item)
      console.log('购物车内容:', cart)
    } else {
      console.log('未找到对应产品')
    }
  }
  getAndAddToCart()
}  

关键修改点： #

• 用Object.values(data)将Firebase返回的对象直接转换为产品对象数组，每个元素都是完整的产品数据
• 直接在数组上调用find()，匹配条件改为product.id === id，返回的就是完整的产品对象
• 增加了判断，避免找不到产品时往购物车推入undefined

如果需要保留Firebase的键名（比如后续需要更新数据），可以用Object.entries()转换后保留键名：

const productsArray = Object.entries(data).map(([key, product]) => ({
  ...product,
  firebaseKey: key // 把键名加到产品对象里
}))

内容的提问来源于stack exchange，提问作者gritoverflow