微信小程序開始結束時間輸入-直接可用


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

發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章