小程序 时间筛选

 
    {{payTime}}
    
      
        {{dateBefore}}
      
    
    -- 
    
      
        {{dateAfter}}
      
    
  

.date{
  display: flex;
  flex-flow: row nowrap;
  padding: 20rpx;
}
.date>view:first-child{
  font-size: 30rpx;
}
.date>view:nth-child(2){
  margin-left: 30rpx;
}
.pay_time{
  line-height: 35rpx;
  font-size: 32rpx;
  padding-top: 10rpx;
}
.picker{
 border:3rpx solid #515151;
 padding: 10rpx;
 background-color: #FFFFFF;
 width: 180rpx;
 height: 40rpx;
 font-size: 30rpx;
}

data: {
    payTime:"缴费日期:",
    dateBefore: "2018-01-01",
    dateAfter: "2018-01-01",
  },
  /*时间选择器 */
  bindDateBeforeChange: function (e) {
    this.setData({
      dateBefore: e.detail.value
    })
  }, 
  bindDateAfterChange: function (e) {
    this.setData({
      dateAfter: e.detail.value
    })
  },

结果：