本篇經(jīng)驗(yàn)將繼續(xù)分享表單類(lèi)組件中picker滾動(dòng)選擇器之時(shí)間選擇器組件的使用詳解。經(jīng)驗(yàn)基于第一個(gè)手工構(gòu)建的微信小程序演示，具體構(gòu)建步驟，可參考如下經(jīng)驗(yàn)引用。 查詢(xún)官方文檔并設(shè)置屬性 1. 先百度搜索

本篇經(jīng)驗(yàn)將繼續(xù)分享表單類(lèi)組件中picker滾動(dòng)選擇器之時(shí)間選擇器組件的使用詳解。經(jīng)驗(yàn)基于第一個(gè)手工構(gòu)建的微信小程序演示，具體構(gòu)建步驟，可參考如下經(jīng)驗(yàn)引用。

查詢(xún)官方文檔并設(shè)置屬性

1. 先百度搜索查看picker滾動(dòng)選擇器組件的官方文檔，通過(guò)設(shè)置其mode屬性的值可使用不同的滾動(dòng)選擇器，不同的選擇器除了公共屬性外，還會(huì)有一些特殊屬性。本篇經(jīng)驗(yàn)分享時(shí)間選擇器的相關(guān)內(nèi)容（即mode'time'）。

在wxml文件中創(chuàng)建選擇器

2. 在wxml文件中，通過(guò)picker標(biāo)簽創(chuàng)建一個(gè)多列選擇器，相關(guān)操作如下：

1. 設(shè)置mode屬性的值為'time'，即時(shí)間選擇器；
2. 使用動(dòng)態(tài)綁定的方式設(shè)置選擇器的value屬性，即當(dāng)前值；
3. start和end屬性設(shè)置選擇器可選擇的時(shí)間范圍；
4. bindchange屬性可綁定選擇器改變后的回調(diào)函數(shù)。

在js文件中定義變量和回調(diào)函數(shù)

3. 在js文件中定義上面數(shù)據(jù)綁定所使用的變量，以及bindchange屬性綁定的回調(diào)函數(shù)。

在wxss文件中定義樣式

4. 在wxss文件中聲明wxml中組件所使用的類(lèi)的樣式定義。

查看效果和觸發(fā)回調(diào)函數(shù)

5. 保存編譯后，在模擬器中查看頁(yè)面效果，符合預(yù)期。點(diǎn)擊選擇器，彈出滾動(dòng)選擇區(qū)域，當(dāng)超出設(shè)置的時(shí)間范圍后，會(huì)自動(dòng)回彈；確認(rèn)選擇一個(gè)時(shí)間后，會(huì)觸發(fā)bindchange綁定的回調(diào)函數(shù)。