步驟，在item.wxml文件中增加一個(gè)picker組件，如下：

如圖

從圖中可以看出：

1.日期后面是空白的，應(yīng)該默認(rèn)顯示今天日期； 2.點(diǎn)擊確定也沒(méi)有顯示到組件上，需要實(shí)現(xiàn)bindDateChange方法。

于是我們需要在item.js文件中，聲明一個(gè)data值date與wxml中的{{date}}綁定關(guān)聯(lián)

然后在onLoad中初始化字符串格式的日期值，詳細(xì)說(shuō)明見(jiàn)注釋：

經(jīng)過(guò)如上處理，日期組件已經(jīng)顯示為當(dāng)前日期

如圖

處理到此，我們還需要修復(fù)一個(gè)邏輯錯(cuò)誤，即組件的結(jié)束日期應(yīng)該不超過(guò)當(dāng)日，做法也很簡(jiǎn)單，只需要在wxml文件中對(duì)picker的日期屬性end由2017-09-01改為{{date}}即可

<picker mode="date" value="{{date}}" start="{{date}}" end="2017-09-01" bindchange="bindDateChange">

吐槽一下，官方的picker的還是有bug的，完全不聽(tīng)start與end使喚，仍可以選任意日期，暫時(shí)不去理會(huì)，代碼就這么寫(xiě)著，什么時(shí)候開(kāi)發(fā)工具修復(fù)了自然可以了，畢竟是現(xiàn)在還只是內(nèi)測(cè)，就將就用著。

接下來(lái)處理日期組件點(diǎn)擊確認(rèn)事件bindDateChange

回到item.js文件

聲明一個(gè)bindDateChange方法，添加如下代碼以寫(xiě)回data中的date值

至此，已經(jīng)實(shí)現(xiàn)集成日期picker組件。剩下的就是將它同之前的標(biāo)題、類型、金額字段那樣存在json再本地setStorage存儲(chǔ)即可，這里不作贅述