這篇文章給大家分享的是有關(guān)怎么開發(fā)一個小程序的日期選擇器的內(nèi)容。小編覺得挺實用的,因此分享給大家做個參考。一起跟隨小編過來看看吧。
成都創(chuàng)新互聯(lián)公司專注于鎮(zhèn)遠企業(yè)網(wǎng)站建設(shè),響應(yīng)式網(wǎng)站開發(fā),商城網(wǎng)站制作。鎮(zhèn)遠網(wǎng)站建設(shè)公司,為鎮(zhèn)遠等地區(qū)提供建站服務(wù)。全流程按需開發(fā),專業(yè)設(shè)計,全程項目跟蹤,成都創(chuàng)新互聯(lián)公司專業(yè)和態(tài)度為您提供的服務(wù)
源碼:
-----------------------我是分割線--------------------------
<!---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-viewindicator-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>
感謝各位的閱讀!關(guān)于怎么開發(fā)一個小程序的日期選擇器就分享到這里了,希望以上內(nèi)容可以對大家有一定的幫助,讓大家可以學(xué)到更多知識。如果覺得文章不錯,可以把它分享出去讓更多的人看到吧!
分享標題:怎么開發(fā)一個小程序的日期選擇器
網(wǎng)頁鏈接:http://www.chinadenli.net/article0/jigioo.html
成都網(wǎng)站建設(shè)公司_創(chuàng)新互聯(lián),為您提供品牌網(wǎng)站制作、網(wǎng)頁設(shè)計公司、網(wǎng)站設(shè)計公司、建站公司、ChatGPT、網(wǎng)站設(shè)計
聲明:本網(wǎng)站發(fā)布的內(nèi)容(圖片、視頻和文字)以用戶投稿、用戶轉(zhuǎn)載內(nèi)容為主,如果涉及侵權(quán)請盡快告知,我們將會在第一時間刪除。文章觀點不代表本網(wǎng)站立場,如需處理請聯(lián)系客服。電話:028-86922220;郵箱:631063699@qq.com。內(nèi)容未經(jīng)允許不得轉(zhuǎn)載,或轉(zhuǎn)載時需注明來源: 創(chuàng)新互聯(lián)