使用localstorage保存购物车数据的相关问题。

发布于 2022-09-06 01:17:34 字数 2109 浏览 18 评论 0

背景:前端小白不会后端语言,所以准备用js+localstorage实现商品加入购物车功能。
问题:我觉得我的代码逻辑貌似没什么问题,但是后台console出来的结果比较奇怪。
console结果,重点是'a'和'JSON parse'那两行的结果居然不一样

我的实现思路是:
添加购物车数据时分为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 技术交流群。

扫码二维码加入Web技术交流群

发布评论

需要 登录 才能够评论, 你可以免费 注册 一个本站的账号。

评论(1

旧故 2022-09-13 01:17:34

我知道原因了... k===cart_array.length而不是= 看来这个别扭劲还是没有转过来啊 。。。

~没有更多了~
我们使用 Cookies 和其他技术来定制您的体验包括您的登录状态等。通过阅读我们的 隐私政策 了解更多相关信息。 单击 接受 或继续使用网站,即表示您同意使用 Cookies 和您的相关数据。
原文