最新国产好看的视频,伊人天堂AV在线,国产Aaaaaa视频,蜜臀视频在线观看一区,人妻av色图,密臀久久久精品影片,青青视频免费观看毛片,久草在线观看视,国产三级精品色情在线

微信小程序的日期選擇器的實例詳解

 更新時間:2017年09月29日 10:50:39   作者:qq_32486147  
這篇文章主要介紹了微信小程序的日期選擇器的實例詳解的相關(guān)資料,希望通過本能幫助到大家,需要的朋友可以參考下

微信小程序的日期選擇器的實例詳解

前言:

關(guān)于微信小程序中的日期選擇器大家用過都會發(fā)現(xiàn)有個很大的問題,就是在2月的時候會有31天,沒有進(jìn)行對閏年的判斷等各種情況??戳斯俜轿臋n提供的源碼后進(jìn)行了一些修改,測試修復(fù)了上面所說的bug!

下面源碼:

<!---js---》

const date = 
new Date();//獲取系統(tǒng)日期

const years = []

const months = []

const days = []

const bigMonth = [1,3,5,7,8,10,12]



//將日期分開寫入對應(yīng)數(shù)組



//年

for (let i =
1990; i <= date.getFullYear(); i++) {

years.push(i);

}



//月

for (let i =
1; i <= 12; i++) {

months.push(i);

}



//日

for (let i =
1; i <= 31; i++) {

days.push(i);

}





Page({



/**

* 頁面的初始數(shù)據(jù)

*/

data: {

years: years,

year: date.getFullYear(),

months: months,

month: 2,

days: days,

day: 2,

value: [9999, 
1, 1],

},

showToask: function() {

wx.showToast({

title: '成功',

icon: 'success',

duration: 2000

})

},

//判斷元素是否在一個數(shù)組

contains: function(arr, obj) {

var i = arr.length;

while(i--) {

if (arr[i] === obj) {

return true;

}

}

return false;

},

setDays: function (day) {

const temp = [];

for(let i =1; i<=day; i++) {

temp.push(i)

}

this.setData({

days: temp,

})

},



showLoading: function () {

wx.showLoading({

title: '加載中...',

}),

setTimeout(function () {

wx.hideLoading()

},2000)

},

//選擇滾動器改變觸發(fā)事件

bindChange: function (e) {

const val = e.detail.value;

//判斷月的天數(shù)

const setYear = 
this.data.years[val[0]];

const setMonth = 
this.data.months[val[1]];

const setDay = 
this.data.days[val[2]]

// console.log(setYear + '年' + setMonth + '月' + setDay + '日');

//閏年

if (setMonth === 
2) {

if (setYear % 
4 === 0 && setYear % 
100 !== 0) {

// console.log('閏年')

this.setDays(28);

} else {

// console.log('非閏年')

this.setDays(29);

}

}else {

//大月

if (this.contains(bigMonth, setMonth)){

this.setDays(31)

}else {

this.setDays(30)

}

}

this.setData({

year: setYear,

month: setMonth,

day: setDay

})

}


})

<!---wxml--->

與官方文檔是一樣的!

<view 
style='text-align:center;margin-top:30px;'>{{year}}年{{month}}月{{day}}日</view>

<picker-view
indicator-style="height:50px;"
style='width:100%;height:300px;text-align:center'
value="{{value}}"
bindchange="bindChange">

<picker-view-column>

<view 
wx:for="{{years}}" 
wx:key="year" 
style='line=height:50px;'>

{{item}}年

</view>

</picker-view-column>

<picker-view-column>

<view 
wx:for="{{months}}" 
wx:key="month">

{{item}}月

</view>

</picker-view-column>

<picker-view-column>

<view 
wx:for="{{days}}" 
wx:key="day">

{{item}}日

</view>

</picker-view-column>

</picker-view>

</view>

如有疑問請留言或者到本站社區(qū)交流討論,感謝閱讀,希望能幫助到大家,謝謝大家對本站的支持!

相關(guān)文章

最新評論

荔浦县| 塔河县| 健康| 抚州市| 茂名市| 宜春市| 宜兰县| 象山县| 稻城县| 镇赉县| 河北省| 景德镇市| 大港区| 含山县| 九龙城区| 新昌县| 义马市| 资兴市| 连平县| 宁强县| 恭城| 洪洞县| 宁波市| 阳高县| 五寨县| 通州区| 武夷山市| 渑池县| 云林县| 正宁县| 加查县| 天等县| 偃师市| 绥滨县| 岫岩| 宜丰县| 合水县| 临湘市| 绥中县| 沧源| 博湖县|