一、wxml添加升序和降序

在商品列表的wxml文件中添加超链接a标签,分别用于升序和降序的点击。分别绑定升序和降序的点击事件。

、js文件实现升序和降序

分别写对应的按价格升序函数sortByPriceAsc()和按价格降序函数sortByPricDesc()。此时已完成升序和降序的功能。

 三、代码优化去除冗余代码

以上代码的写法可以满足功能需要,但是性能方面想要更优化,需要对代码进行去除冗余的处理。该页面存在三次查询数据库:

  • 1.页面加载的时候,查询商品信息展示在列表页(即onload()里面需要查询数据库表goods访问数据,不需排序)
  • 2.按价格升序的时候,查询商品信息展示在列表页(即sortByPriceAsc()里面查询数据库表goods访问数据,需要按价格升序排序)
  • 3.按价格降序的时候,查询商品信息展示在列表页(即sortByPriceDesc()里面查询数据库表goods访问数据,需要按价格降序排序)

我们可以将三者重复的部分提取出来,定义一个函数getGoods()用于查询商品数据。传递参数type,定义type:0代表不做任何排序 1代表升序 -1代表降序。

然后分别在需要的时候调用getGoods()函数,分别传递对应的参数即可。

onload()里面,调用getGoods(),type传递0表示不根据任何排序查询商品数据。

sortByPriceAsc()里面,调用getGoods(1),type传递1表示根据价格升序查询商品数据。

sortByPriceDesc()里面,调用getGoods(-1),type传递-1表示根据价格降序查询商品数据。

微信小程序云开发-数据库-商品列表数据排序的更多相关文章

  1. 微信小程序云开发-数据库-商品列表数据跳过N条数据

    一.WXML实现 在wxml文件中添加对应链接,点击链接绑定事件skipGoods. 二.js实现 js文件中写skipGoods()函数,实现跳过2条数据的功能.

  2. 微信小程序云开发-数据库-商品列表数据显示N条数据

    一.wxml文件 在wxml文件中,写页面和点击事件,添加绑定事件limitGoods  二.js文件 在js文件中写limitGoods(),使用.limit(3)表示只显示3条数据

  3. 微信小程序云开发-数据库-用户删除数据

    一.在商品详情页添加[删除单条数据]按钮 进入goodDetail.wxml页面,添加[删除单条数据]按钮,绑定点击事件removeGood()  二.进入goodDetail.js文件,定义remo ...

  4. 微信小程序云开发-数据库-用户更新数据并提交

    一.wxml增加input输入框和[更新商品价格]按钮 在商品详情页新增[更新商品价格]按钮,wxml新增部分代码,input绑定事件,用于获取用户输入的内容.按钮绑定事件,用于更新商品价格.  二. ...

  5. 微信小程序云开发-数据库-列表页携带id跳转到详情页

    一.新建页面 新建列表页"pages/goodslist/goodslist",新建列表详情页"pages/gooddetail/gooddetail"  二. ...

  6. 微信小程序云开发-数据库表创建和操作

    一.新建云数据库 进入[云开发]界面,点击[数据库]>添加>创建集合>确定. 二.向数据库中添加数据 选中[数据库],点击[添加记录],向数据库中添加记录 添加[字段]和[值],并选 ...

  7. 微信小程序云开发-数据库和云函数的应用-点赞/收藏/评论功能

    一.准备工作 1.创建数据库表articles,字段分别为: 序号 字段名称 字段类型 字段值 字段描述 备注说明 1 title string "标题1" 文章标题   2 de ...

  8. 微信小程序云开发-数据库-获取用户添加的数据到数据库

    一.列表页面新增[添加商品]按钮 在列表页增加[添加商品]按钮,按钮绑定事件toAdd(),用户点击该按钮跳转到添加商品页面. 在js文件中写toAdd()函数,作用是点击[添加商品]按钮,跳转到[添 ...

  9. 微信小程序云开发-数据库-更新数据

    一.js文件代码使用.update更新数据 写一个更新数据的函数,函数内使用.update更新数据.一定要通过.doc指定修改哪一条数据.  二.wxml文件修改数据的按钮 在wxml文件中写[修改] ...

随机推荐

  1. FPGA与ASIC:它们之间的区别以及使用哪一种?

    FPGA与ASIC:它们之间的区别以及使用哪一种? FPGA Vs ASIC: Differences Between Them And Which One To Use? VL82C486 Sing ...

  2. 实时双频Wi-Fi如何实现下一代车内连接

    实时双频Wi-Fi如何实现下一代车内连接 How real simultaneous dual band Wi-Fi enables next-generation in-vehicle connec ...

  3. 【题解】入阵曲 luogu3941 前缀和 压维

    丹青千秋酿,一醉解愁肠. 无悔少年枉,只愿壮志狂 题目 题目描述 小 F 很喜欢数学,但是到了高中以后数学总是考不好. 有一天,他在数学课上发起了呆:他想起了过去的一年.一年前,当他初识算法竞赛的 时 ...

  4. C# 设置Word文本框中的文字旋转方向

    在Word中可插入文本框,默认情况下插入的文本框中的文字方向为横向排列,对于一些特殊文档的设计要求,需要改变文字方向,如本次测试中的文档排版为考生试卷类型,考生信息栏的内容为下图中的这种, 本文将以C ...

  5. ES7扩展

    前一段时间小编一直在更新javascript es6版本的部分新语法和新特性,鉴于现在js一直在更新,接下来小编将和大家一起进步,一块探究js的新特性.今天小编就和大家一起来看看es7更新的语法和新特 ...

  6. js笔记20

    1.DOM零级事件元素绑定多个click,最后只执行最后一个click    DOM二级事件绑定多个click,都要执行 注意当绑定的多个事件名,函数名,事件发生阶段三者完全一样时,才执行最后一个 第 ...

  7. Java 提效神器 Stream 的冷门技巧

    Stream 使用这个方法创建一个 Stream 对象. new ArrayList<>().stream() Filter 过滤器,里面传递一个函数,这个函数的返回结果如果为 true ...

  8. Ubuntu18.04 LTS x64 构建ARM交叉编译环境(尝试,但失败了!!!估计是编译器没选对)

    [测试而已,由于需要了解编译器和处理器体系,因此先放弃该方法] 动机 入门嵌入式开发,又需要 Windows 又需要 Linux,但资料给的竟然是 Ubuntu9,导致我不能使用 VSCode Rem ...

  9. IDEA打开文件时,关闭SonarLint自动扫描

    操作步骤 1 打开 Preferences mac快捷键:command+, 2 搜索 SonarLint,取消勾选Automatically trigger analysis,保存设置

  10. 详解C++中的多态和虚函数

    一.将子类赋值给父类 在C++中经常会出现数据类型的转换,比如 int-float等,这种转换的前提是编译器知道如何对数据进行取舍.类其实也是一种数据类型,也可以发生数据转换,但是这种转换只有在 子类 ...