微(wēi)信客戶端在打開(kāi)小程序之前，會把整個小程序的代碼包下(xià)載到本地(dì)。
緊接着通(tōng)過 app.json 的 pages 字段就可(kě)以知道(dào)你當前小程序的所有頁面路徑:
{
"pages":[
"pages/index/index",
"pages/logs/logs"
]
}
這(zhè)個配置說明(míng)在 QuickStart 項目定義了(le)兩個頁面，分别位于 pages/index/index 和(hé) pages/logs/logs。而寫在 pages 字段的第一(yī)個頁面就是這(zhè)個小程序的首頁（打開(kāi)小程序看(kàn)到的第一(yī)個頁面）。
于是微(wēi)信客戶端就把首頁的代碼裝載進來，通(tōng)過小程序底層的一(yī)些機制，就可(kě)以渲染出這(zhè)個首頁。
小程序啓動之後，在 app.js 定義的 App 實例的 onLaunch 回調會被執行(xíng):
App({
onLaunch: function () {
// 小程序啓動之後 觸發
}
})
整個小程序隻有一(yī)個 App 實例，是全部頁面共享的，更多的事件回調參考文檔 注冊程序 App 。
接下(xià)來我們簡單看(kàn)看(kàn)小程序的一(yī)個頁面是怎麽寫的。
你可(kě)以觀察到 pages/logs/logs 下(xià)其實是包括了(le)4種文件的，微(wēi)信客戶端會先根據 logs.json 配置生成一(yī)個界面，頂部的顔色和(hé)文字你都(dōu)可(kě)以在這(zhè)個 json 文件裏邊定義好。緊接着客戶端就會裝載這(zhè)個頁面的 WXML 結構和(hé) WXSS 樣式。最後客戶端會裝載 logs.js，你可(kě)以看(kàn)到 logs.js 的大體內(nèi)容就是:
Page({
data: { // 參與頁面渲染的數(shù)據
logs: []
},
onLoad: function () {
// 頁面渲染後 執行(xíng)
}
})
Page 是一(yī)個頁面構造器，這(zhè)個構造器就生成了(le)一(yī)個頁面。在生成頁面的時(shí)候，小程序框架會把 data 數(shù)據和(hé) index.wxml 一(yī)起渲染出最終的結構，于是就得到了(le)你看(kàn)到的小程序的樣子。
在渲染完界面之後，頁面實例就會收到一(yī)個 onLoad 的回調，你可(kě)以在這(zhè)個回調處理你的邏輯。
網站建設開(kāi)發|APP設計開(kāi)發|小程序建設開(kāi)發