界面展示

 結合動(dong)態(tai)圖描述一下目前實現(xian)的功能：

2.1 主頁上半部(bu)(bu)分(fen)顯示用戶(hu)頭像(xiang)與(yu)用戶(hu)名(ming)（和(he)微信中的(de)信息一致，這(zhe)部(bu)(bu)分(fen)組(zu)件(jian)是工具自帶的(de)，我們可以修改這(zhe)部(bu)(bu)分(fen)組(zu)件(jian)和(he)內容，稍候會提到）；下半部(bu)(bu)分(fen)顯示一個經典的(de)問候語“Hello World”，提供一個可點擊的(de)按鈕“點擊獲取火車票(piao)”；

2.2 點(dian)(dian)(dian)擊(ji)按(an)鈕后，通過事(shi)先指定的(de)參(can)數（調(diao)用了(le)百度APIStore中去哪網(wang)火車票查(cha)詢接口，站-站查(cha)詢所需參(can)數為(wei)(wei)始發地、目的(de)地及時(shi)間）發送網(wang)絡請求，將獲取到的(de)JSON數據按(an)火車車次為(wei)(wei)節點(dian)(dian)(dian)進行(xing)解析并在新(xin)頁面(mian)顯示基本信(xin)(xin)(xin)息(xi)(xi)（除了(le)詳細座位信(xin)(xin)(xin)息(xi)(xi)），為(wei)(wei)每個(ge)車次提供一個(ge)可(ke)點(dian)(dian)(dian)擊(ji)的(de)按(an)鈕“點(dian)(dian)(dian)擊(ji)查(cha)看座位信(xin)(xin)(xin)息(xi)(xi)”；

2.3 點擊某車次中(zhong)的座位(wei)查詢按鈕后(hou)，會將該(gai)車次對應(ying)的所有座位(wei)信息顯示在新頁面中(zhong)；

 2.4 點擊后(hou)兩(liang)個(ge)頁(ye)面左上(shang)角的“返回”按(an)鈕(niu)可回到(dao)上(shang)一頁(ye)，這個(ge)功(gong)能也是工具(ju)自帶的；

順便提一(yi)下在博客園中(zhong)插入動畫，上面的(de)演示過程是(shi)一(yi)張格式為gif的(de)圖片(pian)，像添加普(pu)通圖片(pian)一(yi)樣操作即可。錄制工具使用的(de)是(shi)靈者Gif錄制，可以指定開始、停止(zhi)時(shi)所需操作與區域(yu)等錄制信息。

 3. 要(yao)點分(fen)析

關于(yu)微信(xin)小程序工具的使用及初始項目(mu)的結構說(shuo)明，網上資(zi)源已經很(hen)豐富，這里(li)不打算再啰嗦(suo)

下(xia)面(mian)開(kai)始講講我(wo)個(ge)人在學習與(yu)(yu)開(kai)發過程(cheng)中認為值得分享(xiang)與(yu)(yu)記錄的(de)點，歡迎大小神們一(yi)(yi)起討(tao)論與(yu)(yu)指(zhi)正，特別是講得不對或(huo)有待(dai)改善(shan)的(de)地方。下(xia)面(mian)只(zhi)給出(chu)和講的(de)點直(zhi)接相關的(de)代碼，整體(ti)代碼可(ke)以到項目工(gong)程(cheng)中去(qu)查(cha)看，建議大家自己調試一(yi)(yi)遍。

3.1 index

index是項目新建時自動生成的，作為小程(cheng)序的啟(qi)動頁(ye)面。

3.1.1 index.wxml

 首頁的(de)頭像(xiang)與用戶名(ming)，從上圖的(de)演示過程可(ke)以看(kan)出我將微信(xin)的(de)名(ming)字“***”改成(cheng)了“用戶名(ming)”：

<view  bindtap="bindViewTap" class="userinfo">

  　　<image class="userinfo-avatar" src="{{userInfo.avatarUrl}}" background-size="cover"></image>

 　　<;text class="userinfo-nickname">用戶(hu)名</text>  <!-- {{userInfo.nickName}}直(zhi)接寫成“用戶(hu)名” -->

</view>

用戶名(ming)部分原本的(de)(de)(de)內容為{{userInfo.nickName}}，{{key_name}}的(de)(de)(de)作用是(shi)獲取關鍵字名(ming)為key_name對應(ying)的(de)(de)(de)值（數據(ju)一般以key_name:value的(de)(de)(de)形式定(ding)義在wxml文(wen)(wen)件同(tong)目錄下js文(wen)(wen)件的(de)(de)(de)data成員中，后(hou)面會(hui)講解(jie)），image顯示(shi)的(de)(de)(de)頭像資源也是(shi)通過這種方(fang)式指(zhi)定(ding)為src="{{userInfo.avatarUrl}}"，程序中產生的(de)(de)(de)數據(ju)可以在開發(fa)者工具頂部偏右的(de)(de)(de)AppData欄中查看。

如(ru)果不(bu)(bu)需要從js文件(jian)(jian)中(zhong)獲取數(shu)據(ju)，那么可以像(xiang)代(dai)碼中(zhong)“用戶名”那樣直接寫入數(shu)據(ju)值，不(bu)(bu)過一般不(bu)(bu)推薦(jian)這樣做，因為(wei)像(xiang)Android等(deng)平(ping)臺(tai)App在開(kai)發時會將數(shu)據(ju)值放入strings.xml等(deng)文件(jian)(jian)，目的是為(wei)了將數(shu)據(ju)與布(bu)局(ju)分離(li)，布(bu)局(ju)和功能實(shi)現(xian)代(dai)碼分離(li)，方便(bian)開(kai)發與維護(hu)。

組(zu)件(jian)(jian)(jian)中(zhong)(zhong)(zhong)的(de)class項用(yong)(yong)來設(she)置(zhi)其樣(yang)式，屬性名對應的(de)樣(yang)式信息定(ding)義(yi)在(zai)wxss文(wen)(wen)件(jian)(jian)(jian)中(zhong)(zhong)(zhong)，除了可(ke)以使(shi)用(yong)(yong)定(ding)義(yi)在(zai)本目錄(lu)wxss文(wen)(wen)件(jian)(jian)(jian)中(zhong)(zhong)(zhong)的(de)樣(yang)式，還可(ke)以使(shi)用(yong)(yong)app.wxss文(wen)(wen)件(jian)(jian)(jian)中(zhong)(zhong)(zhong)定(ding)義(yi)的(de)。如(ru)(ru)果(guo)樣(yang)式只是在(zai)某頁面中(zhong)(zhong)(zhong)使(shi)用(yong)(yong)，那(nei)么(me)建議定(ding)義(yi)在(zai)其目錄(lu)下的(de)wxss文(wen)(wen)件(jian)(jian)(jian)中(zhong)(zhong)(zhong)，即局部作用(yong)(yong)域內；如(ru)(ru)果(guo)是多個頁面共同使(shi)用(yong)(yong)，即全局樣(yang)式，那(nei)么(me)一(yi)般定(ding)義(yi)在(zai)主程序app.wxss文(wen)(wen)件(jian)(jian)(jian)中(zhong)(zhong)(zhong)。class樣(yang)式可(ke)以指定(ding)組(zu)件(jian)(jian)(jian)的(de)寬高(gao)、背景顏色(se)等屬性，本文(wen)(wen)不再進行詳述。

在界面下方添加按鈕(niu)“點擊獲取火車票”組件：

<view class="gettrain-button" bindtap=&quot;getTrainInfo">

  　　<text>點擊獲(huo)取(qu)火車(che)票</text>

 </view>

按鈕的(de)(de)目標(biao)是為了讓用(yong)戶可以點(dian)擊(ji)進行交互(hu)，至于(yu)使用(yong)button、text或(huo)其他(ta)組件(jian)，視(shi)具體需求(qiu)而定。這里(li)是利用(yong)text組件(jian)，文本內容直接寫入了字串“點(dian)擊(ji)獲取火車(che)票”，對于(yu)只有(you)一(yi)個子(zi)組件(jian)的(de)(de)布局其實可以如下面代碼不(bu)用(yong)嵌套，一(yi)層布局搞定。一(yi)般來(lai)說嵌套層數越少，加載速度越快(kuai)，這對移(yi)動程序的(de)(de)體驗(yan)是至關重要的(de)(de)。

<view class="gettrain-button" bindtap="getTrainInfo">

 　　點(dian)擊獲取火車票(piao)

 </view>

但如果在父容器下有多個子(zi)組件共享(xiang)其定義的樣式，那么嵌(qian)套可以(yi)另(ling)代(dai)碼簡(jian)潔(jie)很多：

<view class="gettrain-button&quot;>

 　　<text bindtap="getTrainInfo">點擊獲(huo)取火車票(piao)</text>;

 　　<text bindtap="getCarInfo">點(dian)擊獲取汽車(che)票</text>

 　　<text bindtap="getPlaneInfo";>點(dian)擊獲取飛機(ji)票</text>

 </view>

組件(jian)若要(yao)有點擊交互(hu)功能，須為(wei)其綁定事(shi)件(jian)響應(ying)方法，常用的有單點--bindtap，長按--binglongtap。bindtap="getTrainInfo&quot;，雙引號中的文(wen)本是方法名稱(cheng)，在js文(wen)件(jian)中以該名定義方法，做(zuo)需(xu)要(yao)的處理即可。

3.1.2 index.js

  實現(xian)wxml布(bu)局中按鈕“點擊獲(huo)取火車(che)票”綁定(ding)的(de)函數功(gong)能：

//獲取火(huo)車票函數(shu)

getTrainInfo: function() {

    wx.request({

        url: '//apis.baidu.com/qunar/qunar_train_service/s2ssearch',

        header: {

            apikey: '361cf2a2459552575b0e86e0f62302bc',

        },

        data: {

            version: '1.0',

            from: '北(bei)京(jing)',

            to: '杭州',

            date: '2016-11-15',

        },

  &nbsp;     success: function(res) {

            var json = res.data;

            //將JSON類型轉為(wei)String類型用(yong)以(yi)url參(can)數傳(chuan)遞，否則傳(chuan)遞后會(hui)變(bian)成[object Object]

       &nbsp;     var jsonString = JSON.stringify(json);

             wx.navigateTo({

                url: '../train/train?trainInfos='+jsonString,

    &nbsp;       });

        },

    });

},

我們先(xian)來看(kan)看(kan)微(wei)信小(xiao)程序官(guan)網對于(yu)網絡請(qing)求方法--wx.request(OBJECT)的說明：

 一(yi)(yi)(yi)般來說，wx api提供的方法默認(ren)會有一(yi)(yi)(yi)個Object參(can)數，需要(yao)時(shi)傳(chuan)入，不(bu)(bu)需要(yao)時(shi)不(bu)(bu)傳(chuan)便(bian)是。不(bu)(bu)過(guo)這(zhe)對于像我這(zhe)種Android開(kai)(kai)發者(zhe)來說一(yi)(yi)(yi)開(kai)(kai)始有點不(bu)(bu)適應，怎么函數調用時(shi)都傳(chuan)入一(yi)(yi)(yi)個{...}參(can)數，內部(bu)各(ge)個項之間用逗號“,”分隔，代碼中的url、data等。

從代碼(ma)中看(kan)，發(fa)起網絡請求時(shi)傳入了圖中列出的四項參數：url、header、data及success，不同需(xu)求傳入的參數也(ye)會不同。對于wx.request方法而(er)言，需(xu)根據網絡請求目標來(lai)傳參數的是前四項：url、header、data及method。

以本案例利用(yong)百度APIStore去哪(na)網火車票獲取站(zhan)--站(zhan)火車票信(xin)息來說（//apistore.baidu.com/apiworks/servicedetail/697.html），其官網給出的(de)接口調用(yong)的(de)參數信(xin)息與格式如(ru)下：

將上面兩張(zhang)圖中的(de)信息結合起來看，參數是一一對應的(de)：

wx url——火車票(piao)查(cha)詢 接口地(di)址；

header——請求參(can)數header；

data——請求參(can)數urlParam；

method——請求方(fang)法(fa)；

因為wx中(zhong)的(de)(de)method參(can)數默認是GET，和(he)火車票查詢(xun)接(jie)口(kou)指定的(de)(de)一致，所以調用時可以省(sheng)略。

而對(dui)于最后三(san)個回調(diao)函數(shu)(shu)：success、fail及comlete，代(dai)(dai)碼(ma)(ma)中添加了success，在(zai)請(qing)求(qiu)(qiu)成功時對(dui)數(shu)(shu)據(ju)進行處理。當然，一般的(de)(de)程序還得對(dui)請(qing)求(qiu)(qiu)失敗(bai)的(de)(de)情況做處理。下面(mian)(mian)就來分析success方法(fa)中的(de)(de)代(dai)(dai)碼(ma)(ma)，包括JSON數(shu)(shu)據(ju)的(de)(de)轉換與新(xin)頁面(mian)(mian)的(de)(de)跳轉，請(qing)求(qiu)(qiu)返回的(de)(de)數(shu)(shu)據(ju)以(yi)參數(shu)(shu)res的(de)(de)形式傳入(ru)到function中。先來看看res中包含了哪(na)些信息，通過代(dai)(dai)碼(ma)(ma)console.log(res)可以(yi)將其打印在(zai)工(gong)具調(diao)試頁面(mian)(mian)的(de)(de)Console項中。

request--ok和statusCode--200表示請(qing)求成功，所以才(cai)會回調success方法。而data對(dui)象(xiang)才(cai)是(shi)我們(men)需要(yao)的(de)數(shu)據，更精確地(di)說，data.data.trainList對(dui)象(xiang)才(cai)是(shi)真正的(de)火車票信息。

var json = res.data，獲取(qu)data對象（網(wang)絡請求(qiu)返回的數據一般為JSON格式），賦給(gei)變量json；

var jsonString = JSON.stringify(json)，將JSON類型(xing)對象暫時轉換為String類型(xing)，用來作為url的(de)參數(shu)部分進(jin)行(xing)傳(chuan)遞；一開始在這(zhe)里(li)耽(dan)擱了很久，不進(jin)行(xing)轉換直接傳(chuan)的(de)話在目標頁面獲取不到想(xiang)要的(de)數(shu)據，下面會說明原因；

url: '../train/train?trainInfos='+jsonString，通過url指(zhi)定的(de)信息跳轉到對(dui)應頁面，如(ru)果不需要額外參數(shu)，直接寫url: '../train/train'；如(ru)果只是傳(chuan)遞簡(jian)單的(de)值，可寫成url: '../train/train?param=123'；

至此，如(ru)果(guo)網絡(luo)沒(mei)有問題，點擊(ji)按(an)鈕便可以進行火車票的查(cha)詢并(bing)攜帶結(jie)果(guo)數據(ju)跳轉(zhuan)到新頁面(mian)了。

3.2 train

train是自(zi)定(ding)義新建的頁面(mian)，用來顯(xian)示火車票基本信息，注意新添的頁面(mian)需在app.json文件中進行配置。

"pages/train/train", &nbsp;//火車票(piao)車次信息頁面(mian)

 "pages/seat/seat"  //車次余票信息頁面

3.2.1 train.wxml

由于站(zhan)--站(zhan)火車票(piao)所(suo)有車次的始發站(zhan)和終點站(zhan)是(shi)一樣，如北京--杭州東，所(suo)以先在頁面頂部(bu)顯示(shi)站(zhan)點信息：

<text class="train-item">出發地(di)：{{trainList[0].from}}</text>

<text class="train-item">;目的地：{{trainList[0].to}}</text>

 trainList對象會在js文件(jian)中定義(yi)成(cheng)data成(cheng)員(yuan)，值為(wei)上面(mian)最后一張圖中的(de)JSON對象--trainList，即火車票車次(ci)數組，每個元素包含一個車次(ci)的(de)具體信息(xi)。

接下(xia)來顯示每(mei)個(ge)車(che)次的(de)信(xin)息，以(yi)(yi)橫線(xian)作分(fen)隔（由(you)于是以(yi)(yi)學習和測(ce)試為目的(de)，所(suo)以(yi)(yi)就沒有在(zai)布局(ju)的(de)美觀(guan)上下(xia)功(gong)夫，大家見(jian)諒）：

<view class="line"&gt;</view>

<block wx:for="{{trainList}}" wx:for-item="train&quot;>

  &nbsp; <text class="train-item">{{index+1}}. 車次：{{train.trainNo}}</text>

   ; <text class=&quot;train-item">車型：{{train.trainType}}</text>

    <text class="train-item">起始時(shi)間：{{train.startTime}}</text>

&nbsp; &nbsp; <text class="train-item">到站時間：{{train.endTime}}</text>

&nbsp;   <text class="train-item">總時長：{{train.duration}}</text&gt;

    <;view id="trainindex-{{index}}" class="getseat-button" bindtap="getSeatInfo">

    &nbsp;   <text>點擊查看(kan)座位(wei)信息&lt;/text>

    </view>

  &nbsp; <view class="line"></view>

</block>

第1、11行(xing)很簡單，在(zai)站點與車(che)次(ci)、車(che)次(ci)與車(che)次(ci)之間添加橫線。

當布局(ju)中的(de)組(zu)件(jian)個數和(he)js中的(de)數據有關，即在wxml中寫(xie)死組(zu)件(jian)不能滿足需求(qiu)時，可以利(li)用block和(he)wx:for來(lai)進行組(zu)件(jian)的(de)動態生成。

第2行wx:for="{{trainList}}"表示block塊中的(de)(de)組(zu)件可(ke)以使用數(shu)組(zu)trainList中的(de)(de)內容，從(cong)下(xia)標0開始迭(die)代，數(shu)據中有(you)幾個元素(su)，就會動態生成(cheng)幾套組(zu)件。wx:for-item="train"指定數(shu)組(zu)中元素(su)的(de)(de)名(ming)稱為train（默(mo)認的(de)(de)是item，指定的(de)(de)意(yi)義之一是可(ke)讀性強），后續獲(huo)取屬性值時可(ke)通(tong)過train.key_name的(de)(de)形式(shi)。

第(di)3行開始(shi)添加組件，類(lei)型是text，值為(wei){{index+1}}. 車次：{{train.trainNo}}，前(qian)半部分用來標(biao)明每個(ge)車次的(de)序號，從1開始(shi)；而(er)index和item類(lei)似，是默(mo)認(ren)的(de)迭代索引(yin)名稱，其實就是數組元素當前(qian)的(de)下標(biao)，從0開始(shi)。

后面(mian)幾行(xing)(xing)添加text組件和(he)第3行(xing)(xing)差不多，但(dan)第8行(xing)(xing)有兩個點說一(yi)下：

*1 bindtap="getSeatInfo"，綁定一個回調函數，點擊(ji)時跳(tiao)轉到(dao)新頁面，顯示當前車(che)次(ci)對應(ying)的座位(wei)信息(xi)；

*2 id="trainindex-{{index}}"，給組(zu)件指定(ding)id，可(ke)以看(kan)到(dao)之前(qian)的組(zu)件都沒有(you)設置過該屬性（不需(xu)(xu)要就可(ke)以不設置），那(nei)么(me)什么(me)時候(hou)需(xu)(xu)要呢？其中一種情況，當js中某組(zu)件綁定(ding)的回調方(fang)法需(xu)(xu)要得知(zhi)是(shi)哪個組(zu)件觸發了自(zi)己的時候(hou)，比如第一點中的方(fang)法getSeatInfo，要想點擊某車次的查看(kan)座位(wei)信息按鈕后顯示出(chu)對應的座位(wei)信息，就得知(zhi)道點擊組(zu)件對應的trainList數(shu)組(zu)下(xia)標，而這個需(xu)(xu)求，正好可(ke)以借助(zhu)id和index屬性來實現；

3.2.2 train.js

首先定義data成員trainList，用(yong)來接收index頁面傳遞(di)過來的(de)數據：

trainList: []

頁面啟動時若有數據需要載入，那么得添加onLoad方法（一開始自動運行，在其中實現數據的加載與處理），否則可以不添加。

onLoad: function(options) {

　　var jsonString = options.trainInfos;

　　//將字串類型轉為JSON類型

　　var json = JSON.parse(jsonString);

　　this.setData({

    　　trainList: json.data.trainList,

　　});

},

當方(fang)法的(de)調用(yong)者有參數傳(chuan)入時(shi)，我(wo)們可以通過添加方(fang)法參數的(de)形式(shi)來獲取(qu)。對于參數名，自動啟(qi)方(fang)法一(yi)般為options，組(zu)件回(hui)調方(fang)法一(yi)般為e（event）。

第2行獲(huo)取index頁(ye)面在打開train頁(ye)面時傳(chuan)入的火車票信(xin)息參數trainInfos。

第4行將(jiang)String類型對象(xiang)轉(zhuan)換回JSON格式，之前在index頁(ye)面提到過，url傳的參(can)數是由(you)JSON格式對象(xiang)轉(zhuan)換過來的String類型。

第(di)6行將真(zhen)正的火車(che)票車(che)次信息數組取出，賦給(gei)數據成員trainList。

注意(yi)：給數據成員賦(fu)值時，必須調(diao)用頁面(mian)自身的setData方法(fa)，否則就算賦(fu)值了也不(bu)會同步到wxml文件中去，這(zhe)一點容易(yi)出錯且(qie)不(bu)好定位(wei)原因(yin)。

車次數組得(de)到后，wxml文件(jian)就會(hui)根據組件(jian)的(de)屬性設置顯示對應的(de)信(xin)息。再來看實(shi)現按鈕“點擊查看座位(wei)信(xin)息”對應的(de)回調方(fang)法：

getSeatInfo: function(e) {

    var prefix = 'trainindex-';

    var trainIndex = e.currentTarget.id.substring(prefix.length);

    //輸出根據組件id獲取的車(che)票索引，用(yong)以顯示詳細的座位信息

    console.log(trainIndex);

    var trainNo = this.data.trainList[trainIndex].trainNo;

    var json = this.data.trainList[trainIndex].seatInfos;

    //將JSON類(lei)型轉為String類(lei)型用以url參數傳(chuan)(chuan)遞(di)，否(fou)則傳(chuan)(chuan)遞(di)后(hou)會變成[object Object]，同(tong)時傳(chuan)(chuan)遞(di)車次

    var jsonString = JSON.stringify(json);

    wx.navigateTo({

        url: '../seat/seat?'+'trainNo='+trainNo+'&seatInfos='+jsonString,

    });

},

第2、3行獲(huo)取之前定(ding)(ding)義的組(zu)(zu)件(jian)id中的index部分，即(ji)點(dian)擊組(zu)(zu)件(jian)對應的trainList數組(zu)(zu)的下標。當(dang)然(ran)原先(xian)定(ding)(ding)義時也可以不添加前綴'trainindex-'，完全是(shi)為(wei)了可讀性，因(yin)為(wei)當(dang)項目越(yue)來越(yue)大時有個一目了然(ran)的標示(shi)總是(shi)不錯的。

第6、7行分(fen)別獲(huo)取車次(ci)信(xin)息的列車號與座位(wei)信(xin)息，他們(men)稍(shao)候會被傳(chuan)遞(di)到(dao)seat頁面。

第9行同樣地將得到(dao)的(de)JSON格式(shi)對象先轉換為String類型，讓其可以在(zai)url中作為可被(bei)正(zheng)確傳遞的(de)參數。

第11行(xing)打(da)開新的頁(ye)面seat顯示(shi)座位信息(xi)，多個(ge)參數之間以“&”符號(hao)分隔。

3.2.3 train.json

主程序中app.json文件(jian)除了(le)配(pei)置(zhi)需(xu)要調(diao)用onLoad方法的頁面外(wai)，還指定了(le)一(yi)些(xie)全局(ju)的window樣式。若某個頁面在自己的json文件(jian)中沒(mei)有定義局(ju)部的window屬性(xing)，或根本沒(mei)有json文件(jian)，那默認將使用全局(ju)的。

項目初始(shi)沒有(you)為index生成json文件(jian)，因(yin)為其作為啟動頁，直接用全局的“WeChat”就好，其實index標題應該是小程序(xu)的名稱(cheng)，我(wo)們自己真正開發(fa)的程序(xu)肯定得取(qu)另一個名字。

 可以(yi)看到，logs、train及seat都對標題進行了定義，結果(guo)就(jiu)是會(hui)覆蓋(gai)掉全局的值。以(yi)train為(wei)(wei)例，其(qi)在(zai)json文件中定義標題為(wei)(wei)“站(zhan)-站(zhan)火車查(cha)詢信息”：

{

   　　"navigationBarTitleText": "站-站火(huo)車查詢信息"

 }

還有一點，頁面的json文件(jian)不(bu)需要也不(bu)能頁面配(pei)置屬(shu)性(xing)（Pages），只能設置window屬(shu)性(xing)，所以(yi)就可(ke)以(yi)省略(lve)window名(ming)稱(cheng)，直(zhi)接像上(shang)述(shu)代碼用(yong){...}形(xing)式即可(ke)。

3.3 seat

seat頁(ye)面(mian)用來顯示某車次的座(zuo)位(wei)信息，包括座(zuo)位(wei)等級、票價及余票。通過(guo)train頁(ye)面(mian)的分析(xi)，相(xiang)信大(da)家對(dui)網絡請求(qiu)，數據(ju)在頁(ye)面(mian)與(yu)頁(ye)面(mian)、wxml與(yu)js文件之間的傳遞漸(jian)(jian)漸(jian)(jian)熟悉了(le)。而(er)seat和train類似，沒有什么特別的地(di)方(fang)，所以和logs一樣這(zhe)里(li)就(jiu)不再講什么了(le)。

4. 小感悟

 微(wei)信小程(cheng)序，雖然目前(qian)還(huan)不知(zhi)道其在微(wei)信的(de)接入(ru)口(kou)，但應該和訂閱號、服務號以及企業號會有所不同。搜索(suo)打開使用，用完關閉(bi)，沒有移(yi)動app的(de)安裝(zhuang)、下載等(deng)過程(cheng)，微(wei)信流(liu)量大，輕(qing)便、易用等(deng)特(te)性是(shi)其優點。然而正是(shi)因為這個優點，開發者擔心這有可能使得(de)小程(cheng)序不能夠像app那樣強大，畢竟接入(ru)口(kou)、審(shen)核機制、推(tui)廣成本以及最大允許內存等(deng)這些(xie)還(huan)未確定的(de)因素對一款應用來說都是(shi)至關重(zhong)要的(de)。

對(dui)于初學者（如原先搞(gao)android開發），暫且不管上面提到(dao)的(de)那些，在弄明白應用需求的(de)同(tong)時，得邁開并加快對(dui)前端知識學習的(de)腳步了。