小程序购物车之加入购物车

购物车功能有两个步骤，1：加入购物车   2：在购物车中增加商品数量，删除商品等等一系列操作，今天先将加入购物车的功能完成

wxml：

<view class="cart" bindtap='addCart' data-id="{{book.id}}" data-img="{{book.goods_img}}" data-title="{{book.goods_title}}" data-price="{{book.goods_prom_price}}" data-num="1" >加入购物车</view>

js：

addCart:function(res){
    //创建动画,
    var animation = wx.createAnimation({
      duration: 3000,
      timingFunction: 'ease-in-out'
    });
    this.animation = animation;
    animation.translateY(-336).step();
    this.setData({
      animationData: this.animation.export(),
      maskVisual: 'show'
    });

    var that = this;
    var cart = wx.getStorageSync('cart') || [];//判断cart存不存在
    var exist = cart.find(function (ele) {  //find遍历cart数组
      return ele.id === res.currentTarget.dataset.id;
    })
    if (exist){
      exist.num = parseInt(exist.num) + parseInt(res.currentTarget.dataset.num);//如果加入购物车的商品存在就增加数量
    }else{
      cart.push(res.currentTarget.dataset);
    }
    wx.setStorage({
      key: 'cart',
      data: cart,
      success: function (res) {
        //添加购物车的消息提示框
        wx.showToast({
          title: "加入购物车成功",
          icon: "success",
          durantion: 2000
        })
      }
    })
    //购物车的图标右上方提示购物车中有多少商品
    var total = 0;
    cart.find(function (ele) {
      total += parseInt(ele.num);
    })
    this.setData({ cartNum: total });
  },

参考：https://blog.csdn.net/sinat_32034679/article/details/78748206