微信小程序时间筛选功能

最新推荐文章于 2024-09-16 22:58:00 发布

Mr-乔木

最新推荐文章于 2024-09-16 22:58:00 发布

阅读量5k

点赞数

分类专栏：微信小程序文章标签：小程序 javascript

本文链接：https://blog.csdn.net/benben1580/article/details/104744217

版权

本文介绍了如何在微信小程序中实现时间筛选功能，通过输入时间段来过滤数据。使用了Wux Weapp和Vant Weapp的组件库，下拉框采用Vant，时间选择器采用Wux。提供的代码示例展示了功能的实现过程，并附有预览图。

摘要由CSDN通过智能技术生成

功能：通过输入时间段，筛选数据
UI 组件库： Wux Weapp,Vant Weapp 下拉框使用的是vant ，时间选择器使用的wux ，之所以混合使用，可能是宝宝我没有仔细找到一个组件库可以同时满足两个操作的.
预览图：

代码如下：

// pages/xxx/xxxxx.js

var app = getApp()
Page({
  /**
   * 页面的初始数据
   */
  data: {
    lang: 'zh_CN',
    startDate: "",
    endDate: "",
    startDateDisplay: "请选择",  // 选择框未选择时间时显示的数据
    endDateDisplay: "请选择",  // 同上
    minDate: "2018-01-01", // 时间选择的起始时间
    startDateStamp: app.getTimeStamp(),  // 设置默认时间为当前时间戳，该方法在app.js中定义了，方法就是js获取当前时间戳，不会请百度。
    endDateStamp: app.getTimeStamp(),
    indexList: []
  },
// 选择时间后的回调方法
  onConfirm(e) {