习题链接
购物车
任务
我们现在有一个购物车列表,在添加商品的时候,商品显示到购物车列表,重复添加数量加1,
好我们现在购物车列表已经有很多商品了,但是超出预算了,我要减掉一些商品,商品数量到0了就删除在购物车上的该商品
关键点
- 数组遍历
- 这次遍历我使用的是forEach
- 在添加的时候使用if判断一下id是否相同,相同则让数量加1就好
- 如果没有相同的id就在遍历外部使用一个push添加进来就好了
- 数组过滤
- 使用filter进行过滤,使用if进行判断id,相同则让数量减1
- 使用三元表达式进行判断num是否小于等于0,是就不返回数据,不是就返回true
- filter是不会修改原数组的,所以需要重新赋值
代码实现 && 完整的代码
- 完成添加商品的函数
addToCart(goods){
// TODO:修改当前函数,实现购物车加入商品需求
let b = true;
this.cartList.forEach(element => {
if(element.id == goods.id) {
element.num++;
b = false;
}
})
if(b){
goods.num = 1;
this.cartList.push(goods);
this.cartList = JSON.parse(JSON.stringify(this.cartList));
}
},
- 完成删除商品的函数
removeGoods(goods){
// TODO:补全代码实现需求
this.cartList = this.cartList.filter((element,index) => {
if(element.id == goods.id) element.num--;
return element.num <= 0 ? false : true;
})
}