微信小程序‘月日时分’时间选择器

1.index.wxml

<picker mode="multiSelector" bindchange="bindMultiPickerChange" bindcolumnchange="bindMultiPickerColumnChange" value="{{multiIndex}}" range="{{multiArray}}">
      <view class="gotime">
        <icon class="icon-box-img" type="info" size="15" color="#C9C9C9"></icon>
        <text>{{eventTime}}</text>
        <text class="iconfont icon-youjiantou"></text>
      </view>
    </picker>

2.index.js

  onLoad(){
    this.init()
  },
  loopArray(start, end) {
    const list = []
    for (let i = start; i <= end; i++) {
      if (i < 10) {
        i = "0" + i;
      }
      list.push("" + i);
    }
    return list
  },

  setDayArray(monthIndex, monthNum = null, day) {
    let num = monthNum || parseInt(this.multiArray[0][monthIndex]);
    if (num == 1 || num == 3 || num == 5 || num == 7 || num == 8 || num == 10 || num == 12) {
      //判断31天的月份
      return this.loopArray(day, 31)
    } else if (num == 4 || num == 6 || num == 9 || num == 11) {
      //判断30天的月份
      return this.loopArray(day, 30)
    } else if (num == 2) {
      //判断2月份天数
      let year = parseInt(this.choose_year);
      if (((year % 400 == 0) || (year % 100 != 0)) && (year % 4 == 0)) {
        return this.loopArray(day, 29)
      } else {
        return this.loopArray(day, 28)
      }
    }
  },

  init() {
    const date = new Date();
    const month = date.getMonth() + 1;
    const day = date.getDate();
    const hours = date.getHours();
    const minutes = date.getMinutes();
    // 计算当前月份的 日 的范围
    this.setData({
      // eventTime: (month < 10 ? '0' + month : month) + '-' + (day < 10 ? '0' + day : day) + ' ' + (hours < 10 ? '0' + hours : hours) + ':' + (minutes < 10 ? '0' + minutes : minutes),
      multiArray: [this.loopArray(month, 12), this.setDayArray(0, month, day), this.loopArray(hours, 24), this.loopArray(minutes, 60)]
    })
  },

  bindMultiPickerChange(e) {
    this.multiIndex = e.detail.value
    const index = this.data.multiIndex;
    const month = this.data.multiArray[0][index[0]];
    const day = this.data.multiArray[1][index[1]];
    const hour = this.data.multiArray[2][index[2]];
    const minute = this.data.multiArray[3][index[3]];
    this.setData({
      eventTime: month + '-' + day + ' ' + hour + ':' + minute
    })
  },
  bindMultiPickerColumnChange(e) {
    const date = new Date();
    const month = date.getMonth() + 1;
    const day = date.getDate();
    const hours = date.getHours();
    const minutes = date.getMinutes();
    this.data.multiIndex[e.detail.column] = e.detail.value;
    if (e.detail.column == 0) {
      this.setData({
        'multiArray[1]': this.data.multiIndex[0] !== 0 ? this.setDayArray(0, month, 1) : this.setDayArray(0, month, day)
      })
      this.setData({
        'multiArray[2]': this.data.multiIndex[0] === 0 && this.data.multiIndex[1] === 0 ? this.loopArray(hours, 24) : this.loopArray(0, 24)
      })
      this.setData({
        'multiArray[3]': this.data.multiIndex[0] === 0 && this.data.multiIndex[1] === 0 && this.data.multiIndex[2] === 0 ? this.loopArray(minutes, 60) : this.loopArray(0, 60)
      })
    }
    if (e.detail.column == 1) {
      this.setData({
        'multiArray[2]': this.data.multiIndex[0] === 0 && this.data.multiIndex[1] === 0 ? this.loopArray(hours, 24) : this.loopArray(0, 24)
      })
      this.setData({
        'multiArray[3]': this.data.multiIndex[0] === 0 && this.data.multiIndex[1] === 0 && this.data.multiIndex[2] === 0 ? this.loopArray(minutes, 60) : this.loopArray(0, 60)
      })
    }
    if (e.detail.column == 2) {
      this.setData({
        'multiArray[3]': this.data.multiIndex[0] === 0 && this.data.multiIndex[1] === 0 && this.data.multiIndex[2] === 0 ? this.loopArray(minutes, 60) : this.loopArray(0, 60)
      })
    }
  },