有你在真好 的个人博客
微信小程序购物车实现及源码
阅读:2263 添加日期:2021/3/27 23:25:08 原文链接:https://www.toutiao.com/item/6432991217562157570/

最近在做一个微信小程序商城在实现购物车功能时费了一点时间,在此分享出来给大家哈

github地址:
https://github.com/yangyuscript/shopcar-wechat-.git

效果图:

微信小程序购物车实现及源码

微信小程序购物车实现及源码

微信小程序购物车实现及源码

最重要的js代码:

var app=getApp()

Page({

data: {

userInfo: {},

selectAll:true,

totalsum:0,

totalnum:0,

loadingHidden: false

},

//事件处理函数

bindMinus:function(e){

var $index=parseInt(e.currentTarget.dataset.index);

var num=this.data.userShopcarSocks[$index].num;

if(num>0){

num--;

}

var minsStatus=num<=0?true:false;

var minusStatuses=this.data.minusStatuses;

minusStatuses[$index]=minsStatus;

var userShopcarSocks = this.data.userShopcarSocks;

userShopcarSocks[$index].num = num;

this.setData({

userShopcarSocks:userShopcarSocks,

minusStatuses:minusStatuses

})

if(this.data.userShopcarSocks[$index].selected){

this.getTotal();

}

},

bindPlus:function(e){

var $index = parseInt(e.currentTarget.dataset.index);

var num = this.data.userShopcarSocks[$index].num;

num++;

var minsStatus = num <= 0 ? true : false;

var minusStatuses = this.data.minusStatuses;

minusStatuses[$index] = minsStatus;

var userShopcarSocks = this.data.userShopcarSocks;

userShopcarSocks[$index].num = num;

this.setData({

userShopcarSocks: userShopcarSocks,

minusStatuses:minusStatuses

})

if (this.data.userShopcarSocks[$index].selected) {

this.getTotal();

}

},

bindSelectOne:function(e){

var $index=parseInt(e.currentTarget.dataset.index);

var selected=this.data.userShopcarSocks[$index].selected;

selected=!selected;

var userShopcarSocks=this.data.userShopcarSocks;

userShopcarSocks[$index].selected=selected;

this.setData({

userShopcarSocks:userShopcarSocks

});

this.getTotal();

},

bindSelectAllhah:function(){

var $selectAll=this.data.selectAll;

$selectAll=!$selectAll;

var $userShopcarSocks=this.data.userShopcarSocks;

if($selectAll){

for (var i = 0, len = $userShopcarSocks.length; i < len; i++) {

$userShopcarSocks[i].selected=true;

}

}else{

for (var i = 0, len = $userShopcarSocks.length; i < len; i++) {

$userShopcarSocks[i].selected = false;

}

}

this.setData({

selectAll: $selectAll,

userShopcarSocks:$userShopcarSocks

})

this.getTotal();

},

bindbuynow:function(){

var $buyShopcarSocks=[];

var $userShopcarSocks=this.data.userShopcarSocks;

var j=0;

console.log("shopcar's length is "+$userShopcarSocks);

for(var i=0,len=$userShopcarSocks.length;i<len;i++){

if($userShopcarSocks[i].selected){

$buyShopcarSocks[j++]=$userShopcarSocks[i];

}

}

console.log("shopcar is "+$buyShopcarSocks);

wx.setStorageSync("buyShopcarSocks",$buyShopcarSocks);

wx.navigateTo({

url:'../confirmorder/confirmorder?totalnum='+this.data.totalnum+'&totalsum='+this.data.totalsum+'&buyShopcarSocks='+$buyShopcarSocks

});

},

getTotal:function(){

//计算总价价格总件数

var $userShopcarSocks = this.data.userShopcarSocks;

var $totalnum = 0;

var $totalsum = 0;

var $count = 0;

var $selectAll = false;

for (var i = 0, len = $userShopcarSocks.length; i < len; i++) {

if ($userShopcarSocks[i].selected) {

console.log("结算");

$count++;

$totalnum += $userShopcarSocks[i].num;

$totalsum += parseFloat($userShopcarSocks[i].sock.price * $userShopcarSocks[i].num);

}

}

if ($count == len) {

$selectAll = true;

}

this.setData({

totalnum: $totalnum,

totalsum: $totalsum.toFixed(2),

selectAll: $selectAll

})

},

onLoad: function () {

console.log('onLoad')

var that = this

var $openid=wx.getStorageSync("user").openid;

//调用应用实例的方法获取全局数据

app.getUserInfo(function (userInfo) {

//更新数据

that.setData({

userInfo: userInfo

})

});

},

onShow:function(){

//获取初始化数据

var $openid=wx.getStorageSync("user").openid;

var that=this;

wx.request({

url: app.globalData.serverPath + 'wechat/findUserShopcarSocks?openid=' + $openid,

data: {},

method: 'GET', // OPTIONS, GET, HEAD, POST, PUT, DELETE, TRACE, CONNECT

// header: {}, // 设置请求的 header

success: function (res) {

// success

console.log(res.data.userShopcarSocks);

//修改合适数据

var minusStatuses=[];

for (var i = 0, len = res.data.userShopcarSocks.length;i<len;i++){

if (res.data.userShopcarSocks[i].sock.title.length>10){

res.data.userShopcarSocks[i].sock.title = res.data.userShopcarSocks[i].sock.title.substring(0,9)+"...";

}

if (res.data.userShopcarSocks[i].selected=="true"){

res.data.userShopcarSocks[i].selected=true;

}else{

res.data.userShopcarSocks[i].selected = false;

}

minusStatuses[i]=false;

}

that.setData({

userShopcarSocks: res.data.userShopcarSocks,

sockPicUrl: app.globalData.serverPath + "img/uploadSockImg/",

minusStatuses:minusStatuses

});

that.getTotal();

setTimeout(function () {

that.setData({

loadingHidden: true

})

}, 1500)

},

fail: function (res) {

// fail

},

complete: function (res) {

// complete

}

});

}

})

大家多看看源码哦,这样才会真的进步。。。加油!!!需要源码可以去github地址fork哈,当然请大牛们批评指正,再次感谢!!!

ICP备案号:苏ICP备14035786号-1 苏公网安备 32050502001014号