我把代码全贴出来。你看一下吧

       
  
 
  0  单价：10元 小计：0元 
 
  0  单价：7.5元 小计：0元 
 
  0  单价：15元 小计：0元 
 
  0  单价：20元 小计：0元 
 
  0  单价：150元 小计：0元 
 
  
单价最高：0元
 
总计：0元
   

用面向对象来写购物车再合适不过了，下面是es6代码

class Cart{ constructor(){ //set，map，array，随你选 this.list = []; } //将商品加入购物车，需要判断购物车内是否有该商品， //以及商品规格是否相同 add(goods){} //将商品移除购物车,这个key可以是id，名称等等，你自己决定 remove(key){} //计算购物车总价，当然，最贵的当然可以计算出来了，排个序就号了 computeMoney(){} //保存购物车，localstorage,服务器，你自己决定，保存之后还是之前更新界面还是你决定 save(){} //清空购物车 clear(){} //购物车是否为空 isEmpty(){} //更多逻辑....... }

最好给每个方法添加勾子函数（onSave,onAdd,onRemove....），以实现复用，解耦

原理就是用户在商品选择页点击加号的时候从数据源拿到数据放到一个新数组

var data=res.data; var shopCar=[]; add(index){//点击加号的时候 shopCar[index]=data[index] }

然后得到一个新的数组对象，就是购物车清单。
统计就是把数组对象里的价格字段相加，至于你用什么方法相加看你自己喜好,我用的reduce。

如果有减号，也要有相应的减去操作。