亚洲激情专区-91九色丨porny丨老师-久久久久久久女国产乱让韩-国产精品午夜小视频观看

溫馨提示×

溫馨提示×

您好,登錄后才能下訂單哦!

密碼登錄×
登錄注冊×
其他方式登錄
點擊 登錄注冊 即表示同意《億速云用戶服務條款》

如何在微信小程序中實現一個日期選擇器

發布時間:2021-06-11 17:25:35 來源:億速云 閱讀:151 作者:Leah 欄目:web開發

這篇文章給大家介紹如何在微信小程序中實現一個日期選擇器,內容非常詳細,感興趣的小伙伴們可以參考借鑒,希望對大家能有所幫助。

如何在微信小程序中實現一個日期選擇器

/* JS代碼部分 */
 3 const date = new Date()
const years = []
const months = []
const days = []
const hours = []
const minutes = []
var thisMon = date.getMonth();
var thisDay = date.getDate();
for (let i = 2017; i <= date.getFullYear() + 1; i++) {
 years.push(i)
}
for (let i = date.getMonth(); i <= 11; i++) {
 var k = i;
 if (0 <= i && i < 9) {
  k = "0" + (i + 1);
 } else {
  k = (i + 1);
 }
 months.push(k)
}
if (0 <= thisMon && thisMon < 9) {
 thisMon = "0" + (thisMon + 1);
} else {
 thisMon = (thisMon + 1);
}
if (0 <= thisDay && thisDay < 10) {
 thisDay = "0" + thisDay;
}
var totalDay = mGetDate(date.getFullYear(), thisMon);
for (let i = 1; i <= 31; i++) {
 var k = i;
 if (0 <= i && i < 10) {
  k = "0" + i
 }
 days.push(k)
}
for (let i = 0; i <= 23; i++) {
 var k = i;
 if (0 <= i && i < 10) {
  k = "0" + i
 }
 hours.push(k)
}
for (let i = 0; i <= 59; i++) {
 var k = i;
 if (0 <= i && i < 10) {
  k = "0" + i
 }
 minutes.push(k)
}
function mGetDate(year, month) {
 var d = new Date(year, month, 0);
 return d.getDate();
}
Page({
 data: {
  years: years,
  year: date.getFullYear(),
  months: months,
  month: thisMon,
  days: days,
  day: thisDay,
  value: [1, thisMon - 1, thisDay - 1, 0, 0],
  hours: hours,
  hour: "00",
  minutes: minutes,
  minute: "00",
 },
 bindChange: function (e) {
  const val = e.detail.value
  this.setData({
   year: this.data.years[val[0]],
   month: this.data.months[val[1]],
   day: this.data.days[val[2]],
   hour: this.data.hours[val[3]],
   minute: this.data.minutes[val[4]],
  })
  var totalDay = mGetDate(this.data.year, this.data.month);
  var changeDate = [];
  for (let i = 1; i <= totalDay; i++) {
   var k = i;
   if (0 <= i && i < 10) {
    k = "0" + i
   }
   changeDate.push(k)
  }
  this.setData({
   days: changeDate
  })
 },
})

/* css代碼部分 */
.time-title{
 float:left;
 width:20%;
 text-align:center;
 color:#45BCE8;
}
.picker-text{
 text-align:center;
}
/*mask*/
.time_screens {
 width: 100%;
 position: fixed;
 bottom: 0;
 left: 0;
 z-index: 1000;
 opacity: 0.5;
 overflow: hidden;
}
/* html代碼部分 */
 <view class="time_screens">
  <view >{{year}}-{{month}}-{{day}}
   <label >取消</label>
   <label >確定</label>
  </view>
  <view >
  </view>
  <picker-view indicator-  value="{{value}}" bindchange="bindChange">
   <picker-view-column class="picker-text">
    <view wx:for="{{years}}" >{{item}}年</view>
   </picker-view-column>
   <picker-view-column class="picker-text">
    <view wx:for="{{months}}" >{{item}}月</view>
   </picker-view-column>
   <picker-view-column class="picker-text">
    <view wx:for="{{days}}" >{{item}}日</view>
   </picker-view-column>
  </picker-view>
 </view>
/* Json */
{
 "navigationBarTitleText": "XXXX"
}

關于如何在微信小程序中實現一個日期選擇器就分享到這里了,希望以上內容可以對大家有一定的幫助,可以學到更多知識。如果覺得文章不錯,可以把它分享出去讓更多的人看到。

向AI問一下細節

免責聲明:本站發布的內容(圖片、視頻和文字)以原創、轉載和分享為主,文章觀點不代表本網站立場,如果涉及侵權請聯系站長郵箱:is@yisu.com進行舉報,并提供相關證據,一經查實,將立刻刪除涉嫌侵權內容。

AI

元谋县| 澄江县| 云龙县| 阿拉尔市| 色达县| 宜章县| 宝山区| 读书| 临高县| 德庆县| 治多县| 竹山县| 盈江县| 东乌| 宁乡县| 镇原县| 西青区| 论坛| 巍山| 闵行区| 扬中市| 新干县| 应城市| 高青县| 东平县| 二连浩特市| 铜山县| 子洲县| 广饶县| 棋牌| 麻栗坡县| 丹江口市| 金湖县| 和静县| 阳春市| 五寨县| 玉林市| 通化市| 咸丰县| 龙陵县| 科尔|