微信小程序中商城购物车实例,追加删除购物车中个别商品实例

购物车的做法都是运用缓存来实现，小程序也一样，这个方法重要的想法，当然也有其他更好的方法去实现。同样的每行解析。

商品详细页

  tocar: function (event) {//event必须要加不然用不了event.currentTarget.dataset。这个函数已经被formSubmit函数取代
    var goods_id = event.currentTarget.dataset.carId;//点击事件的获取商品id
    //console.log(goods_id);
    var goods_arr = wx.getStorageSync('goods_arr');
    if (goods_arr) {
      goods_arr[goods_id] = goods_id;
      wx.setStorageSync('goods_arr', goods_arr);
    } else {
      var goods_arr = {};//开空对象
      goods_arr[goods_id] = goods_id;//key和value都是goodsId
      wx.setStorageSync('goods_arr', goods_arr);//更多的商品加入到购物车时，以多数组形式保存
    }
    //wx.setStorageSync('goods_id', goods_id);
    wx.switchTab({//接着跳到购物车页
      url: "../car/car"
    });
  },  formSubmit: function (event) {
    var goods_id = event.detail.value.goods_id;
    var qidingliang = event.detail.value.qidingliang;
    //console.log(qidingliang);
    if(qidingliang ==""){
                    wx.showToast({
  title: '请输入订购量',
  icon: 'loading',
  duration: 2000
})
    }else{
    var goods_arr = wx.getStorageSync('goods_arr');//拿购物车中商品id数组
    var qingling_arr = wx.getStorageSync('qingling_arr');//拿购物车中订购量数组
    //console.log(qingling_arr);
    if (goods_arr && qingling_arr) {//都有的情况下，进行对应的添加
      goods_arr[goods_id] = goods_id;
      qingling_arr[goods_id] = qidingliang;
      wx.setStorageSync('goods_arr', goods_arr);
      wx.setStorageSync('qingling_arr', qingling_arr);
    } else {//没的情况下，开空数组，然后同上进行对应的添加
      var qingling_arr = {};
      var goods_arr = {};
      goods_arr[goods_id] = goods_id;
      qingling_arr[goods_id] = qidingliang;
      wx.setStorageSync('goods_arr', goods_arr);
      wx.setStorageSync('qingling_arr', qingling_arr);
    }
    //wx.setStorageSync('goods_id', goods_id);
    wx.switchTab({//完成后跳到购物车页面重
      url: "../car/car"
    });
    }
  }

购物车页

  onShow: function () {
    var that = this;
    var goods_arr = wx.getStorageSync('goods_arr');//拿添加到购物车中商品的id数组
    var qingling_arr = wx.getStorageSync('qingling_arr');//拿添加到购物车中商品的订购量数组
    //console.log(qingling_arr);
    if (!goods_arr || JSON.stringify(goods_arr) == "{}") {//不存在或把购物车删干净后提示后跳转
      this.orClear(1)
      wx.showModal({
        title: '提示',
        content: '你还没添加礼品呢，请先去挑选',
        success: function (res) {
          if (res.confirm) {
            wx.switchTab({
              url: "../index/index"
            })
          }
        }
      })
    }else{
    this.countTotal(that,goods_arr,qingling_arr);//交给countTotal自定义函数处理
    this.user_address();
    var vip_code=wx.getStorageSync('vip_code');
    //console.log(vip_code);
    this.setData({
      vipCode:vip_code
    })
    }
  },
  countTotal:function(that,goods_arr,qingling_arr){
        var arr = [];//开空数组
        //console.log(goods_arr);
    for (var i in goods_arr) {//对商品id组进行遍历
      var subject = goods_arr[i];
      arr.push(subject);//通过push统一转移
    }
    var post_id = arr.join();//将arr数组通过join方法转为字符串
    console.log(post_id);
    var url = "https://www.xxxxxxxxxxxxxxxx";//交给后台做处理
    //console.log(url);
    var money=[];//开金钱空数组
    wx.request({
      url: url,
      data: {
        gallery_id: post_id//去吧一连串有商品ID组成的字符串
      },
      method: 'POST',
      header: { 'content-type': 'application/json' },
      success: function (res) {
        //console.log(res);
        //console.log(qingling_arr[803]);
        for (var i = 0; i < res.data.length; i++) {//后台返回的结果是带有该商品所有信息的数组，这里遍历出来
          var goods_id = res.data[i].goods_id;//为下一步做准备的赋值。
          res.data[i]['qinglingliang'] = qingling_arr[goods_id];//缓存的订购量数组出场，拿由上一步中后台结果给出的商品id带到订购量数组中的key中出，直接得出用户的订购量
          //console.log(res.data[i]['qinglingliang']);
          var marke=res.data[i].costPrice;
            money[i]= marke * res.data[i]['qinglingliang'];//开个总价空组数，把各个商品的价钱放进去
        }
        //console.log(money);
        var sum=0;
       for (var i = 0; i < money.length; i++){
sum += parseInt(money[i]);//遍历算总价，所有商品的总价
}
//console.log(sum);
        that.setData({ 
          goods_list_key: res.data,
          total_money:sum
         });
      }
    });
  }

删除购物车中个别商品

  del_goods: function (event) {
    wx.showModal({
      title: '提示',
      content: '你正准备从购物车中删除这个商品',
      success: function (res) {
        if (res.confirm) {
          //wx.removeStorageSync('goods_arr');
          var delId = event.currentTarget.dataset.delId;//转过来的商品id
          var goods_arr = wx.getStorageSync('goods_arr');
          delete goods_arr[delId];//删除对象中的元素
          var qingling_arr = wx.getStorageSync('qingling_arr');//拿添加到购物车中商品的订购量数组
          delete qingling_arr[delId];//删除对象中的元素
          wx.setStorageSync('goods_arr', goods_arr);//重新设缓存
             wx.setStorageSync('qingling_arr', qingling_arr);//重新设缓存
          wx.showToast({
            title: '删除成功',
            icon: 'success',
            duration: 1000
          });
          setTimeout(function () {
            wx.switchTab({
              url: "../index/index"
            })
          }, 2000);
        }
      }
    })
  }

判断购物车页是否为空的简易处理

  orClear:function(e){
    //console.log(e);为空是1，购物车有缓存为2，显示界面做简单处理
       this.setData({
      carClear: e
    })
  }