? ? ? ?上一篇對小程序的基本配置和創(chuàng)建等做了一個(gè)簡單的介紹，這里就講一個(gè)小例子：
如果我們想寫一個(gè)下面這種列表頁：
我們先看index.wxml部分：
整頁都是view標(biāo)簽看起來好藍(lán)瘦。。。
下面的列表部分涡尘，我們用到了wx:for這個(gè)指令來循環(huán)這個(gè)列表，這里的用法跟vue真是神似，下面依舊是模板數(shù)據(jù)填充搅幅，bindtap用于綁定一個(gè)方法，用法可以在后面的index.js里看到呼胚。
接下來wxss就直接貼個(gè)圖好了:
這里提一句茄唐，小程序的單位統(tǒng)一為rpx,同樣是根據(jù)屏幕寬度進(jìn)行自適應(yīng)的，但存在一個(gè)像素的問題蝇更，在不同手機(jī)里邊框的1px是不同的視覺感受沪编，不過搜到一個(gè)比較靠譜的解決辦法，就是在公共wxss里進(jìn)行如下設(shè)置：
（例）.border-top-hack {position: relative}
.border-top-hack:after {position: absolute;content: '';width: 100%;left: 0;height: 1px;background-color: #dadada;-webkit-transform: scale(1,.5);transform: scale(1,.5);-webkit-transform-origin: center top;transform-origin: center top;}
接下來,看看index.js部分：
我們通過require 把需要用的模塊引入進(jìn)來年扩。
若需要對一個(gè)值進(jìn)行重新設(shè)置蚁廓，一定要用上this.setData()
wx.request( )發(fā)送一個(gè)獲取列表的請求，將返回值push出去厨幻，然后如前所說wx:for將列表渲染出來
之前我們在wxml里用bindtap綁定了一個(gè)toItem( )的方法相嵌，點(diǎn)擊時(shí)就會觸發(fā)這個(gè)事件，使用小程序封裝得路由况脆，wx.navigateTo 跳轉(zhuǎn)到 下一頁饭宾，并帶上本條列表的id值。
? ? ? ?這是一個(gè)簡單的列表頁格了，用到的api也就那么幾個(gè)看铆，但小程序提供了豐富的api,有興趣可以直接看小程序官方文檔，感覺已經(jīng)寫得非常全面了~
小程序一直在更新組件盛末，前天剛寫了wx.navigateTo 這玩意兒只能跳轉(zhuǎn)五層→_→性湿，今天發(fā)現(xiàn)又更新了Ｎ嘲痢！肤频！新出爐的API叹括，wx.navigateBack(OBJECT)，可關(guān)閉當(dāng)前頁面宵荒，返回上一頁面或多級頁面汁雷。通過getCurrentPages()) 可獲取當(dāng)前的頁面棧，決定需要返回幾層报咳。這就解決了上次說的只能返回5層的問題侠讯，里面的參數(shù)delta即返回的頁面數(shù)，如果 delta 大于現(xiàn)有頁面數(shù)暑刃，則返回到首頁厢漩。
哈哈，第二篇小例子就說到這兒啦岩臣，感覺還是沒辦法把一個(gè)東西的精髓講出來溜嗜，看來自己還需要在這條路上慢慢修煉吶??~
