小程序购物车显示数字实时同步

小程序购物车显示数字实时同步

首先，先给购物车定义一个数值，起始值为0，每点击一下商品加入购物车就要给这个数值加1，这是最基础的；然后就是商品加入购物车里后，在购物车里操作商品，例如：增加减少商品数量，或删除此商品，对应的数值也要减少。在这里可以直接在点商品的界面js里的onShow方法里面写定义的数值等于购物车里面存储商品的总数。这样就可以做到点击商品数量增加，点到购物车界面进行增减删操作之后，再回到商品界面，定义数值也会对应改变。
例：

存本地购物车显示数字同步

定义数值：

 data: {
		Arab:[],   //定义数值
		hj:0,
		hg:0,    //下面这两个同步商品数量时用到
	}

点击+1

addGood() {     //点击添加方法
	this.setData({
        	Arab: this.data.Arab+1     //使数值+1
     	})
  	 }

利用查询本地缓存的方法查询购物车缓存里有多少商品，然后计算总商品数，赋值给定义数值

var LpL = (wx.getStorageSync('good') || []);
//查询本地缓存
     for (var i = 0; i < LpL.length;i++){
     //循环一个i
        this.data.hg += LpL[i].goodsNumber
        //算商品数量总和
        this.data.hj = this.data.hg
        //给遍值
     }
     
     this.setData({
     
        Arab:this.data.hj,
        //同步定义数值
        hg:0
        //刷新初始商品数量总和/必要（不刷新则会叠加）
     })

OK