微信小程序自定義日期區(qū)間選擇日歷組件

1.實(shí)現(xiàn)效果

可以設(shè)置不同的主題色

在這里插入圖片描述

2.實(shí)現(xiàn)步驟

定義組件date：

在這里插入圖片描述

組件的屬性properties：

isShow：是否展示日期選擇
timeStart：區(qū)間的開始時(shí)間
timeEnd：區(qū)間的結(jié)束時(shí)間
minDate：日期區(qū)間的最小時(shí)間，最小時(shí)間不要和當(dāng)前日期相差太久
theme_color：主題色值

組件的方法：

最小時(shí)間，可進(jìn)行自定義，無最大時(shí)間，當(dāng)滑動(dòng)至頁面的底端，每次加載下六個(gè)月的日期值。
利用scroll-into-view的屬性將日期定位到當(dāng)前月份。

引入組件

{
  "usingComponents": {
    "date":"../components/date/index"
  },
  "navigationBarTitleText": "自定義多日期選擇"
}

<!--minDate最小時(shí)間 默認(rèn)為2018/1/1,日期格式為yyyy/mm/dd ,最小時(shí)間和當(dāng)前日期盡量不要相差太大,無最大日期,在觸底時(shí)每次加載6個(gè)月-->
<date isShow="true" timeStart="{{sel_list.start_time}}" minDate="2019/1/1" timeEnd="{{sel_list.end_time}}" theme_color="#2493F8"
  bind:tapYes="dateSubmit" bind:tapNo="closeModal" id="date" />

3.獲取完整代碼

4.更多小程序源碼，關(guān)注蘇蘇的碼云

?著作權(quán)歸作者所有,轉(zhuǎn)載或內(nèi)容合作請(qǐng)聯(lián)系作者
【社區(qū)內(nèi)容提示】社區(qū)部分內(nèi)容疑似由AI輔助生成，瀏覽時(shí)請(qǐng)結(jié)合常識(shí)與多方信息審慎甄別。
平臺(tái)聲明：文章內(nèi)容（如有圖片或視頻亦包括在內(nèi)）由作者上傳并發(fā)布，文章內(nèi)容僅代表作者本人觀點(diǎn)，簡(jiǎn)書系信息發(fā)布平臺(tái)，僅提供信息存儲(chǔ)服務(wù)。

相關(guān)閱讀更多精彩內(nèi)容

友情鏈接更多精彩內(nèi)容