微信小程序常用的业务逻辑

上拉加载下一页数据

业务逻辑

1.用户上滑页面滚动条触底开始加载下一页数据

​ 1.利用滚动条触底事件(onReachBottom)

​ 2.判断还有没有下一页数据

​ 1.获取到总页数 总页数=Math.ceil(总条数 / 页容量)

​ 2.获取到当前的页码

​ 3.判断一下当前的页码是否大于总页数,如果大于的话,表示没有下一页数据

2.假如没有下一页数据,弹出一个提示框

3.假如还有下一页数据,来加载下一页数据

​ 1.当前的页码++

​ 2.重新发送请求

​ 3.数据请求回来,要对data中的数组进行拼接而不是全部替换

下拉刷新数据

业务逻辑

1.触发下拉刷新事件,需要在页面的json文件中开启一个配置项

​ 找到触发下拉刷新事件

2.重置数据和数组

3.重置页码设置为1

4.重新发送请求

5.数据发送请求回来需要手动关闭等待效果

加入购物车

1.先绑定点击事件

2.获取缓存中的购物车数据,数组格式

3.先判断当前的商品是否已经存在于购物车中

4.已经存在,修改商品数据,执行购物车数量++,重新把购物车数据填充回缓存中

5.不存在购物车的数据中,直接给购物车数组添加一个新元素,新元素带上购买数量属性,重新把购物车数组填充回缓存中

6.弹出提示

购物车

一、获取用户的收货地址

1.绑定点击事件

2.获取用户对小程序所授予获取地址的权限状态scope

​ 1.假设用户点击获取收货地址的提示框确定 authSetting scope.address scope值为true,直接调用获取收货地址

​ 2.假设用户从来没有调用过收货地址的api,scope undefined 直接调用获取收获地址

​ 3.假设用户点击获取收货地址的提示框 取消 scope值为false

​ 1.诱导用户自己打开授权设置页面(wx.openSetting)当用户重新给与获取地址权限的时候

​ 2.获取收货地址

​ 4.把获取到的收货地址存入到本地存储中

二、页面加载完毕

1.onLoad onShow

2.获取本地存储中的地址数据

3.把数据设置给data中的一个变量

三、onShow

1.回到了商品详情页面,第一次添加商品的时候手动添加了属性

​ 1.num=1

​ 2.checked=true

2.获取缓存中的购物车数组

3.把购物车数据填充到data中

四、全选的实现,数据展示

1.onShow获取缓存中的购物车数组

2.根据购物车中的商品数据,所有的商品都被选中 checked=true 全选就被选中

五、总价格和总数量

1.都需要商品被选中,我们才能拿它们来计算

2.获取购物车数组

3.遍历

4.判断商品是否被选中

5.总价格 +=商品单价*商品数量

6.把计算后的价格和数量设置回data即可

六、商品的选中

1.绑定change事件

2.获取被修改的的商品对象

3.商品对象的选中状态取反

4.重新填充回data中和缓存中

5.重新计算全选。总价格 总数量

七、全选和反选

1.全选复选框绑定事件change

2.获取data中的全选变量 allChecked

3.直接取反 allChecked=!allChecked

4.遍历购物车数组让里面的商品选中状态跟随allChecked改变而改变

5.把购物车数组和allChecked重新设置回data,把购物车重新设置回缓存中

八、商品数量的编辑

1.“+” “-” 按钮绑定一同一个点击事件区分的关键是自定义属性

​ 1.“+” “+1”

​ 2.“-” “-1”

2.传递被点击的商品id goods_id

3.获取data中的购物车数组来获取需要被修改的商品对象

4.当购物车的数量=1 同时用户点击 “-”,弹框提示(showModal)询问用户是否要删除

​ 1.确定 直接执行删除

​ 2.取消 什么也不做

5.把cart数组重新设置回缓存中和data中 this. setCart

九、点击结算

1.判断有没有收货地址信息

2.判断用户有没有选购商品

3.经过以上验证跳转到支付页面!

支付功能实现

一、页面加载的时候

从缓存中获取购物车的数据渲染到页面中,这些数据checked=true

二、微信支付

1.那些人 那些账号 可以实现微信支付

​ 1.企业账号

​ 2.企业账号的小程序后台中必须给开发者添加白名单

​ 1.一个appid可以同时绑定多个开发者

​ 2.这些开发者就可以公用这个appid和它的开发权限

三、支付按钮

1.先判断缓存中有没有token

2.没有 就跳转授权页面进行获取token

3.有token往下执行

4.创建订单,获取订单编号

5.准备预支付

6.发起微信支付

7.查询订单状态

8.已经完成了微信支付

9.手动删除缓存中已经被选中的商品

10.在跳转页面

猜你喜欢

转载自blog.csdn.net/qq_42802170/article/details/106010455