购物车功能有两个步骤,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" 加入购物车/viewjs:
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













