微信小程序中列表数据的计算与计算值的显示

微信小程序中列表数据的计算与计算值的显示,第1张

页面加载时显示GPA、总学分、课程数

数据列表

绩点GPA=(成绩之和/课程数-50)/  10;

课程数为listlength

给每个初始数据初始值,都为0

这个时候需要计算了,因为是要在页面加载时显示,所以在onload中写:

计算出值后,把值给初始数据,以此来显示所求得的值。

大家都知道,针对一款app上面都是展示信息的,那么在小程序中,页面上信息的展示是如何的,接下来进行详细探索:

在微信小程序中,编写页面布局是在wxml文件中进行的,则在wxml文件中,使用<view></view>标签进行内容的包裹,类似html中的<div>,现在进行一个需求的编写,在页面上编写布局,并将js结尾文件中的处理数据进行展示到页面上;

indexwml

indexjs

编译项目,则页面展示如下:

从上面结果可以知道在wxml文件中使用{{}}可以将js文件中指定的内容展示在页面上,现在我们进行动态的展示数据,不需要展示起在page-data中固定的内容,修改js文件内容:

编译项目,显示结果如图:

由此可知,在js中动态的设置内容并将其更新到wml上,则使用 thissetData(),且修改的内容格式符合key:value。

就小程序页面数据展示就分析到这里,希望各位看官们有所收获,有什么错误的地方还望指出!!

以上就是关于微信小程序中列表数据的计算与计算值的显示全部的内容,包括:微信小程序中列表数据的计算与计算值的显示、微信小程序入门(四):页面数据展示、等相关内容解答,如果想了解更多相关内容,可以关注我们,你们的支持是我们更新的动力!

欢迎分享,转载请注明来源:内存溢出

原文地址:https://www.54852.com/zz/10121811.html

(0)
打赏 微信扫一扫微信扫一扫 支付宝扫一扫支付宝扫一扫
上一篇 2023-05-05
下一篇2023-05-05

发表评论

登录后才能评论

评论列表(0条)

    保存