在电商小程序中,我们通常给用户一个购物车的功能,可以自主的将商品加入购物车。因为所购商品有单价和数量,我们需要计算一个小计。
规则是小计=单价*数量
计算完小计后需要根据所购商品的小计的金额进行一下求和,计算出总的价格。
要想实现购物车功能,我们考虑了两种方案,一种是将商品加入到小程序缓存,然后通过缓存来操作。另外一种方案是建立数据源,每次用户选择商品时加入到数据源里计算结果。
一位粉丝根据专栏电商小程序
开发时遇到了不少问题,以下是我们的沟通过程以及问题定位的过程
抽空帮看一下 设置完求和金额显示0
看代码是否哪块写错了,
给指导一下,谢谢
这里的字段我们需要注意的是首先需要有一个openid的字段,这是一个数据权限的字段,用来标识数据是属于谁的
另外一个是商品小计的字段,现在类型选择了计算公式。计算公式会根据你自己的算法自动的进行计算
用的啥表达式?
我们在课程里讲了要通过API来计算购物车的合计金额,然后通过变量来调取API的计算结果,将结果绑定到组件上进行显示
现在问题的表现是合计金额是0,不知道哪里出了问题。一般初学者遇到的最大障碍就是不知道该如何调试程序,发现没有获得预期的效果就觉得无从下手了。
一般调试分为后端调试和前端调试,首先要判断后端是否正常返回结果了,因此我让他通过API的方法测试看是否可以返回正常结果
看返回结果是0,从截图上看,首先就是提交参数那,没有给正确的参数
{
"openid":"这里是示例"
}
默认参数的值是这里是示例,你自己在做测试的时候,要传入实际的值,按默认值肯定是查不到数据的
再一个就是检查代码,看参数是否正确传入了
我们在构造入参的时候,左边是参数名,右边是参数值,这个要符合json对象格式的语法
这里构造了一个查询条件,字面意思是openid= 实际的值
这里有一个语法叫字符串字面值,一般用双引号包裹起来就构成了一个字符串字面值,那你实际的查询效果变成了
openid = params.openid这样肯定就查不出内容来了,实际我们是要把入参求值之后在作为查询条件,因此将代码改为
{
"key":"openid",
"rel":"eq",
"val":params.openid
}
改了之后发现还是返回不了值,这个时候就需要检测一下你的数据
这里商品单价有两行明显是有问题的,出现这种问题说明是在数据录入的时候质量不太好,究其原因是我们的校验做的不好,让脏数据入库了。
在实际项目里,你不能认为用户就会按照既定的规则去录入数据,要么是疏忽,要么是故意录入,因此字段类型校验是必要的。
另外的问题是openid有几条数据是空的,这种情况一般是你通过PC端录入时会出现。因为在H5的环境下是获取不到openid的,需要你将程序发布成小程序进行测试
将代码修改好,参数也传对之后API是可以正常返回了
后端正确返回之后,发现金额还是0,那就需要排查前端了,我们是通过变量定义去获取API,那就打开开发调试工具,输入变量的路径,看看页面有没有正常返回回来数据
如果变量没返回,那说明你参数没有正确传入,确实取不到值的,我们可以改一下,在生命周期函数通过API来调一下,代码结构是
const result = await app.cloud.callConnector(
{
name:'API标识',
methodName:'方法标识',
params:{
openid:app.auth.currentUser.openId
}
}
)
console.log(result)