一、小程序架構(gòu)
每個小程序的結(jié)構(gòu)都有兩個主要部分構(gòu)成:主體部分+各個頁面。類似于許多框架,主體部分主要用于核心的配置,各個頁面主要用于不同業(yè)務(wù)場景。
1.1、主體部分主要由3個文件構(gòu)成
1)app.js:小程序邏輯,初始化APP
2)app.json:小程序配置,比如導(dǎo)航、窗口、頁面http請求跳轉(zhuǎn)等
3)app.wxss:公共樣式配置
主體配置完成之后,就是對應(yīng)業(yè)務(wù)開發(fā)了,也就是開發(fā)者最常操作的頁面。小程序頁面設(shè)計基本上也是遵循MVC結(jié)構(gòu)進行構(gòu)建。
1.2、頁面由4個文件構(gòu)成
1)js:頁面邏輯,相當(dāng)于控制層(C);也包括部分的數(shù)據(jù)(M)
2)wxml:頁面結(jié)構(gòu)展示,相當(dāng)于視圖層(V)
3)wxss:頁面樣式表,純前端,用于輔助wxml展示
4)json:頁面配置,配置一些頁面展示的數(shù)據(jù),充當(dāng)部分的模型(M)
二、配置app.json
app.json
全局配置頁面文件的路徑、窗口表現(xiàn)、設(shè)置網(wǎng)絡(luò)超時時間、設(shè)置多tab等。
pages
接受一個數(shù)組,每一項都是字符串,來指定小程序由哪些頁面組成
window
用于設(shè)置小程序的狀態(tài)欄、導(dǎo)航條、標(biāo)題、窗口背景色。
tabBar
通過tabBar配置項指定tab欄的表現(xiàn),以及tab切換時顯示的對應(yīng)頁面。tabBar配置數(shù)組,只能配置最少2個、最多5個tab,tab按數(shù)組的順序排序。
networkTimeout
可以設(shè)置各種網(wǎng)絡(luò)請求的超時時間。
debug:true/false
可以在開發(fā)者工具中開啟debug模式,在開發(fā)者工具的控制臺面板,調(diào)試信息以info的形式給出,其信息有Page的注冊,頁面路由,數(shù)據(jù)更新,事件觸發(fā)??梢詭椭_發(fā)者快速定位一些常見的問題
page.json
每一個小程序頁面也可以使用.json文件來對本頁面的窗口表現(xiàn)進行配置。頁面的哦誒址比app.json全局配置簡單的多,只是設(shè)置app.json中的window配置項的內(nèi)容,頁面中配置項會覆蓋app.json的window中相同的配置項。