微信小程序开始结束时间输入-直接可用

wxm代码

<view class="section" style="background:#dfe0e2;margin:20rpx;padding:20rpx">
  <picker bindchange="bindPickerChange" value="{{index}}" range="{{array}}">
    <view class="picker">
      分类：{{array[index]}}
    </view>
  </picker>
</view>
 
 
<view class="section" style="background:#dfe0e2;margin:20rpx;padding:20rpx">
  <picker mode="date" value="{{date1}}"  bindchange="bindDateStartChange">
    <view class="picker">
      开始日期: {{date1}}
    </view>
  </picker>
</view>
 
<view class="section" style="background:#dfe0e2;margin:20rpx;padding:20rpx">
  <picker mode="date" value="{{date2}}"  bindchange="bindDateEndChange">
    <view class="picker">
     结束日期: {{date2}}
    </view>
  </picker>
</view>
 
<button type="primary" size="{{primarySize}}" loading="{{loading}}" plain="{{plain}}"
        disabled="{{disabled}}" bindtap="query"> 查询 </button>

js代码：

 
Page({
  data: {
    date1: '',
    date2: '',
    array: ['选择分类的参数一', '选择分类的参数二'],
    index: 0,
  },
 
  onLoad: function () {
 
    var that = this;
    var dateNow = new Date();
    var year = dateNow.getFullYear();
    var month = dateNow.getMonth() + 1;
    var day = dateNow.getDate()
    var date = year + "-" + month + "-" + day
    that.setData({
      date1: date,
      date2: date
    });
 
  },
 
  //  点击开始日期组件确定事件
  bindDateStartChange: function (e) {
    var that = this;
    that.setData({
      date1: e.detail.value
    })
  },
 
  //  点击结束日期组件确定事件
  bindDateEndChange: function (e) {
    var that = this;
    that.setData({
      date2: e.detail.value
    })
  },
  //  点击分类组件确定事件
  bindPickerChange: function (e) {
    var that = this;
    that.setData({
      index: e.detail.value
    })
  },
  //点击查询时组件的事件
  query: function (e) {
    var that = this;
    var array = that.data.array;
    var index = that.data.index;
    var startDate = that.data.date1;
    var endDate = that.data.date2;
    console.log("分类："+array[index])
    console.log("开始时间：" + startDate)
    console.log("结束时间" + endDate)
 
 
  },
})

————————————————
版权声明：本文为CSDN博主「怪只怪满眼尽是人间烟火」的原创文章，遵循CC 4.0 BY-SA版权协议，转载请附上原文出处链接及本声明。
原文链接：https://blog.csdn.net/weixin_38959210/article/details/104554983