小程序自定义年月日

官方给的案例没有区分平年闰年以及大小月份的天数,这里直接写一个

html:

<view>{{time}}</view>
<view>
  <picker-view indicator-style="height: 50px;" style="width: 100%; height: 300px;" value="{{value}}" bindchange="bindChange">
      <picker-view-column>
        <view wx:for="{{years}}" wx:key="{{years}}" style="line-height: 50px; text-align: center;">{{item}}年</view>
      </picker-view-column>
      <picker-view-column>
        <view wx:for="{{months}}" wx:key="{{months}}" style="line-height: 50px; text-align: center;">{{item}}月</view>
      </picker-view-column>
      <picker-view-column>
        <view wx:for="{{days}}" wx:key="{{days}}" style="line-height: 50px; text-align: center;">{{item}}日</view>
      </picker-view-column>
    </picker-view>
</view>

js

  data: {
    years: ['2020', '2021', '2022', '2023', '2024', '2025', '2026', '2027', '2028', '2029', '2030'],
    months: ['1', '2', '3', '4', '5', '6', '7', '8', '9', '10', '11', '12'],
    days: ['1', '2', '3', '4', '5', '6', '7', '8', '9', '10', '11', '12', '13', '14', '15', '16', '17', '18', '19', '20', '21', '22', '23', '24', '25', '26', '27', '28', '29', '30', '31'],
    time: []
  },//这里是默认展示2020-1-1
  bindChange(e) {
    let val = e.detail.value
    if (parseFloat(val[1]) == 1) {
      if (parseFloat(val[0]) == 0 || parseFloat(val[0]) == 4 || parseFloat(val[0]) == 8) {
        this.setData({
          days: ['1', '2', '3', '4', '5', '6', '7', '8', '9', '10', '11', '12', '13', '14', '15', '16', '17', '18', '19', '20', '21', '22', '23', '24', '25', '26', '27', '28', '29']
        })
      }//0 4 8 实际上是上面数据中的2020 2024 2028,四年一闰
      else {
        this.setData({
          days: ['1', '2', '3', '4', '5', '6', '7', '8', '9', '10', '11', '12', '13', '14', '15', '16', '17', '18', '19', '20', '21', '22', '23', '24', '25', '26', '27', '28']
        })
      }
    } //这里处理2月份是28或者29天
    else if (parseFloat(val[1]) == 0 || parseFloat(val[1]) == 2 || parseFloat(val[1]) == 4 || parseFloat(val[1]) == 6 || parseFloat(val[1]) == 7 || parseFloat(val[1]) == 9 || parseFloat(val[1]) == 11) {
      this.setData({
        days: ['1', '2', '3', '4', '5', '6', '7', '8', '9', '10', '11', '12', '13', '14', '15', '16', '17', '18', '19', '20', '21', '22', '23', '24', '25', '26', '27', '28', '29', '30', '31']
      })
    } //这里是处理31天的月份
    else {
      this.setData({
        days: ['1', '2', '3', '4', '5', '6', '7', '8', '9', '10', '11', '12', '13', '14', '15', '16', '17', '18', '19', '20', '21', '22', '23', '24', '25', '26', '27', '28', '29', '30']
      })
    }//这里是处理30天的月份
      this.setData({
      time: this.data.years[val[0]] + '/' + this.data.months[val[1]] + '/' + this.data.days[val[2]]
    })
  }