Vue应用程序，Javascript，有条件地将对象添加到数组中

Question

我有一个餐厅菜单，它是一个对象数组，每个对象都具有以下属性：-

• 姓名
• id - id 是自动生成的
• 数量
• options - 它本身是一个包含两个值对的数组 -size & price

现在，我想允许用户在验证购物车中不存在所选商品后将商品添加到购物车，我面临的问题是，每个商品都有一个 Id，但同时时间有两种或多种不同的大小

这是我的代码

export default {
data(){
  return {
    cart: []
  }
}

//...
methods: {
    addItem(pizza, options){
      let selectedPizza= {
        id: pizza.id,
        name: pizza.name,
        size: options.size,
        price: options.price
        quantity: 1
      }
      
      if(this.cart.length > 0) {
        this.cart.forEach(item => {
          if(item.name === selectedPizza.name && item.size === selectedPizza.size && item.id === selectedPizza.id) {
            return item.quantity++
          } else {
            this.cart.push(selectedPizza)
          }
        })
      } else {
        this.cart.push(selectedPizza)
      }
    } 
  }
}

上面的代码可以正常工作，除非我尝试添加不同大小的同一个披萨，因为在这种情况下，id 是重复的，因为每个项目都有一个 ID，不是每个披萨大小都有一个，任何人都可以想的解决方法？ 提前谢谢..

Answer 1

这似乎更像是一个数据结构问题，而不是语法或编码问题。在您的情况下，我会添加一个重复的比萨饼，每种尺寸一个。这样你仍然可以增加金额。即：

• 菠萝披萨（小）1x

• 菠萝披萨（大）1x

  如果您愿意，您必须重组数据

• 菠萝披萨 2x（小号和大号）

您的问题并没有真正表明您想要什么解决方案。