layui合计功能

今天就来给大家讲一下我在做项目中遇到的问题,项目中有这样一个效果,选中一些商品,然后的单价都加起来,显示所有选中的商品单价的累计消费。首先看一下它的代码,它是怎么使用的。如下图所示:
layui合计功能_第1张图片

首先我们需要给他开启该列的自动合计功能,也就是说哪一列需要合计一些数据的就在那一列上面添加totalRow:true这个参数。前提是你必须在前面写一个开启自动合计功能的是参数totalRow:true。接下来就是totalRowText:””这个参数;你也可以不用写上totalRowText这个参数,可写可不写。它的功能就是显示自定义合计文本,这样子你就可以实现合计这个功能啦。如下图所示:
layui合计功能_第2张图片

当我们实现了这个功能之后就有小伙伴问怎么获取合计里面的数据。这个我们只需要把数据渲染完做个回调便可以获取合计里面的数据。回调的方法如下:
layui合计功能_第3张图片

首先你可以在控制台打印一下参数,看看是怎么使用的。然后在声明一个变量,变量的初始值都为0,接下来通过for循环遍历每一行当前页的数据和数据的总长度。之后你可以将获取的数据赋值给你声明的变量里面。然后你就可以去使用它。效果如下图所示:
layui合计功能_第4张图片

你可能感兴趣的:(layui,前端,javascript)