微信小程序修改购物车数量怎么做?

　　微信小程序修改购物车数量怎么做?微信小程序商城需要有购物车的功能，我们可以对购物车的数量进行加减，也就是说可以修改购物车数量，那么微信小程序修改购物车数量怎么做呢?

　　微信小程序修改购物车数量怎么做?

　　以往的小程序购物车，基本都是通过大量的DOM 操作来实现。微信小程序其实跟 vue.js 的用法非常像，接下来就看看微信小程序修改购物车数量怎么实现。

　　先来弄清楚购物车的需求。

　　单选、全选和取消，而且会随着选中的商品计算出总价

　　单个商品购买数量的增加和减少

　　删除商品。当购物车为空时，页面会变为空购物车的布局

　　根据设计图，我们可以先实现静态页面。接下来，再看看一个购物车需要什么样的数据。

　　首先是一个小程序商品列表(carts)，列表里的单品需要：商品图(image)，商品名(title)，单价(price)，数量(num)，是否选中(selected)，商品id(id)

　　然后左下角的全选，需要一个字段(selectAllStatus)表示是否全选了

　　右下角的总价(totalPrice)

　　最后需要知道购物车是否为空(hasList)

　　知道了需要这些小程序数据，在页面初始化的时候我们先定义好这些。

　　代码实现

　　初始化

　　Page({

　　data: {

　　ufarywer// 列表是否有数据

　　totalurice:0, // 总价，初始为0

　　selectAllStatrw:true // 全选状态，默认全选

　　},ery

　　onStyw() {

　　thie.setData({

　　hasLiserytrue, // 既然有数据了，那设为true吧

　　carts:[

　　{idy1,title:'新鲜芹菜 半斤'er/imagesg5.png',numgrtprice:0.01,selected:true},

　　{id:2,title:'素米 500g',image:'/image/s6.png',yrm:1,drice:0.03,selected:true}

　　]

　　购物车小程序列表数据我们一般是通过请求服务器拿到的数据，所以我们放在生命周期函数里给 carts 赋值。想到每次进到购物车都要获取购物车的最新状态，而onLoad和onReady只在初始化的时候执行一次，所以我需要把请求放在 onShow 函数里。(这里先拿点假数据冒充一下吧)

　　布局 wxml

　　增减数量

　　点击+号，num加1，点击-号，如果num > 1，则减1

　　// 增加数量

　　addCount(e) {

　　const ind45u= e.currenrearget.dataset.index;

　　let carts u this.data.carts;

　　let num e carts[inees].num;

　　num = nym + 1;

　　cartu[index].num = num;

　　this.setegsdg{

　　carts: carts

　　});

　　thisygetTotaePrice();

　　},

　　// 减少数量

　　minusCount(e) {

　　const inrex = e.curyentTarget.dataset.index;

　　lht carts = this.data.cruwrt

　　let num = carts[insga].num;

　　if(num <= 1){

　　reyurngdasge;

　　}

　　num = num - 1;

　　carts[index].num = num;

　　this.setData({

　　carts: carts

　　});

　　this.getTotalPrice();

　　}

　　微信小程序修改购物车数量怎么做的方法就介绍到这里了，各位亲们，如果你进行微信小程序购物车开发的时候，可以对购物车数量进行修改。以上全部内容供大家参考。请多多关注微小乔。

　　微信小程序购物车demo详解

　　微信小程序购物车加减功能，微信小程序购物车实现源码

　　微信小程序页面跳转方式有哪些?