微信小程序-时间picker(怎样设置起始时间小于结束时间,并筛选出在此时间范围的数据)...

可以通过设置起始时间小于结束时间的限制条件来实现时间picker的功能。具体步骤如下：

1. 在时间picker组件中设置起始时间和结束时间的初始值。

2. 添加一个事件监听器来监听时间变化事件，并在事件处理函数中获取起始时间和结束时间的值。

3. 判断起始时间是否小于结束时间，如果不是，则提示用户重新选择时间。

4. 如果起始时间小于结束时间，则根据起始时间和结束时间筛选出在此时间范围内的数据。

以下是一个简单的示例代码：

// 在 wxml 文件中添加时间picker组件
<view>
  <picker mode="time" bindchange="onTimeChangeStart" value="{{startTime}}"></picker>
  <picker mode="time" bindchange="onTimeChangeEnd" value="{{endTime}}"></picker>
</view>

// 在 js 文件中添加事件监听器和事件处理函数
Page({
  data: {
    startTime: '08:00',
    endTime: '18:00',
    dataList: [
      {time: '08:30', content: '会议1'},
      {time: '10:00', content: '会议2'},
      {time: '12:30', content: '会议3'},
      {time: '15:00', content: '会议4'},
      {time: '18:30', content: '会议5'},
    ],
    filteredDataList: [], // 筛选后的数据
  },

  // 时间变化事件处理函数
  onTimeChangeStart(event) {
    this.setData({
      startTime: event.detail.value,
    });
    this.filterDataList();
  },

  onTimeChangeEnd(event) {
    this.setData({
      endTime: event.detail.value,
    });
    this.filterDataList();
  },

  // 根据时间范围筛选数据
  filterDataList() {
    const { startTime, endTime, dataList } = this.data;
    const filteredDataList = dataList.filter(item => {
      const time = item.time;
      return time >= startTime && time <= endTime;
    });
    this.setData({
      filteredDataList,
    });
  },
});

在上面的代码中，我们定义了一个 `dataList` 数组来存储所有的数据，并且添加了一个 `filteredDataList` 数组来存储筛选后的数据。在时间picker组件中，我们设置了起始时间和结束时间的初始值，并且添加了 `bindchange` 事件监听器来监听时间变化事件。在事件处理函数中，我们获取起始时间和结束时间的值，并根据它们筛选出在此时间范围内的数据。最后，我们将筛选后的数据存储在 `filteredDataList` 数组中，供页面渲染使用。