使用localstorage保存购物车数据的相关问题。
背景:前端小白不会后端语言,所以准备用js+localstorage实现商品加入购物车功能。
问题:我觉得我的代码逻辑貌似没什么问题,但是后台console出来的结果比较奇怪。
我的实现思路是:
添加购物车数据时分为2种情况。
- 情况1:后台没有购物车数据,这时购物车数据所代表的数组应该为空,只需要把新增的数据对象直接push到数组中,然后把数组解析为字符串进行localstorage即可。
情况2:后台中已经有购物车数据,这时需要先把字符串解析为数组,然后再把新增数据的id与已有数据中每一个对象的id去比对。
- 情况2a: 数组中已经有一个对象的id与新增数据的id相同,那么就直接把该对象重置为id:新增id,num:amount_old+amount_new
- 情况2b: 数组中的id都与新增数据的id不相同,就直接把新增数据push到数组中即可。
$('.add-to-shoppingCart').click(function(){
var href = location.href;
var product_id = parseInt(href.split('?')[1].split('=')[1]);
var shoppingData =
{
"id": product_id,
"num": amount
};
var shopping_cart_str = localStorage.getItem("shoppingCart");
var cart_array;
if(typeof(JSON.parse(shopping_cart_str))==='object'&&JSON.parse(shopping_cart_str)!==null){
cart_array = JSON.parse(shopping_cart_str);
console.log(JSON.parse(shopping_cart_str),'a'); //console
console.log(cart_array,'JSON parse'); //console
var k=0;
for(let i=0; i<cart_array.length; i++){
if(cart_array[i].id===product_id){
var old_amount = cart_array[i].num;
var new_amount = old_amount + amount;
cart_array.splice(i,1,{ "id":product_id, "num":new_amount });
console.log(cart_array,'splice后'); //console
}else {
k = k+1;
}
} //for循环
if(k=cart_array.length){
cart_array.push(shoppingData);
}
}
else{
var cart_array=[];
cart_array.push(shoppingData);
}
console.log(cart_array,'字符串化前再来console一下') //console
var cart_array_str = JSON.stringify(cart_array);
localStorage.setItem("shoppingCart",cart_array_str);
console.log(localStorage.shoppingCart,'后台存储的购物车数据'); //console
});
如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。
绑定邮箱获取回复消息
由于您还没有绑定你的真实邮箱,如果其他用户或者作者回复了您的评论,将不能在第一时间通知您!
发布评论
评论(1)
我知道原因了... k===cart_array.length而不是= 看来这个别扭劲还是没有转过来啊 。。。