一.小程序基本介紹
- .json 后綴的 JSON 配置文件
- .wxml 后綴的 WXML 模板文件
- .wxss 后綴的 WXSS 樣式文件
- .js 后綴的 JS 腳本邏輯文件
接下來我們分別看看這4種文件的作用追驴。
在根目錄下用app來命名的這四中類型的文件锅棕，就是程序入口文件薄湿。
app.json
必須要有這個文件况脆，如果沒有這個文件说莫，IDE會報錯，因為微信框架把這個作為配置文件入口跟啤，
你只需創(chuàng)建這個文件熬甫，里面寫個大括號就行
以后我們會在這里對整個小程序的全局配置。記錄了頁面組成试读，配置小程序的窗口 背景色杠纵，配置導(dǎo)航條樣式，配置默認標題钩骇。
app.js
必須要有這個文件比藻，沒有也是會報錯！但是這個文件創(chuàng)建一下就行 什么都不需要寫
以后我們可以在這個文件中監(jiān)聽并處理小程序的生命周期函數(shù)伊履、聲明全局變量韩容。
app.wxss
這個文件不是必須的。因為它只是個全局CSS樣式文件
app.wxml
這個也不是必須的唐瀑，而且這個并不是指主界面哦~因為小程序的主頁面是靠在JSON文件中配置來決定的
二.小程序基礎(chǔ)
1.應(yīng)用生命周期
App() 函數(shù)用來注冊一個小程序群凶。接受一個 object 參數(shù)，其指定小程序的生命周期函數(shù)等哄辣。
object參數(shù)說明
onLaunch 當小程序初始化完成時请梢，會觸發(fā) onLaunch（全局只觸發(fā)一次）
onShow 當小程序啟動，或從后臺進入前臺顯示力穗，會觸發(fā) onShow
onHide 當小程序從前臺進入后臺毅弧，會觸發(fā) onHide
onError 當小程序發(fā)生腳本錯誤，或者 api 調(diào)用失敗時当窗，會觸發(fā) onError 并帶上錯誤信息
onPageNotFound 當小程序出現(xiàn)要打開的頁面不存在的情況够坐，會帶上頁面信息回調(diào)該函數(shù)
以上是小程序應(yīng)用的生命周期
前臺、后臺定義： 當用戶點擊左上角關(guān)閉崖面，或者按了設(shè)備 Home 鍵離開微信元咙，小程序并沒有直接銷毀，而是進入了后臺巫员；當再次進入微信或再次打開小程序庶香，又會從后臺進入前臺。需要注意的是：只有當小程序進入后臺一定時間简识，或者系統(tǒng)資源占用過高赶掖，才會被真正的銷毀感猛。
2.頁面生命周期
Page() 函數(shù)用來注冊一個頁面。接受一個 object 參數(shù)奢赂，其指定頁面的初始數(shù)據(jù)陪白、生命周期函數(shù)、事件處理函數(shù)等呈驶。
1.小程序注冊完成后拷泽，加載頁面，觸發(fā)onLoad方法袖瞻。
2.頁面載入后觸發(fā)onShow方法，顯示頁面拆吆。
3.首次顯示頁面聋迎，會觸發(fā)onReady方法，渲染頁面元素和樣式枣耀，一個頁面只會調(diào)用一次霉晕。
4.當小程序后臺運行或跳轉(zhuǎn)到其他頁面時，觸發(fā)onHide方法捞奕。
5.當小程序有后臺進入到前臺運行或重新進入頁面時牺堰，觸發(fā)onShow方法。
6.當使用重定向方法wx.redirectTo(OBJECT)或關(guān)閉當前頁返回上一頁wx.navigateBack()颅围，觸發(fā)onUnload
3.應(yīng)用生命周期影響頁面生命周期
1.小程序初始化完成后伟葫，頁面首次加載觸發(fā)onLoad，只會觸發(fā)一次院促。
2.當小程序進入到后臺筏养，先執(zhí)行頁面onHide方法再執(zhí)行應(yīng)用onHide方法。
3.當小程序從后臺進入到前臺常拓，先執(zhí)行應(yīng)用onShow方法再執(zhí)行頁面onShow方法渐溶。
4.配置
app.json文件用來對微信小程序進行全局配置，決定頁面文件的路徑弄抬、窗口表現(xiàn)茎辐、設(shè)置網(wǎng)絡(luò)超時時間、設(shè)置多 tab 等掂恕。
window用于設(shè)置小程序的狀態(tài)欄拖陆、導(dǎo)航條、標題竹海、窗口背景色慕蔚。
| 屬性 | 類型 | 默認值 | 描述 | 最低版本 |
|---|---|---|---|---|
| navigationBarBackgroundColor | HexColor | #000000 | 導(dǎo)航欄背景顏色，如"#000000" | |
| navigationBarTextStyle | String | white | 導(dǎo)航欄標題顏色斋配，僅支持 black/white | |
| navigationBarTitleText | String | 導(dǎo)航欄標題文字內(nèi)容 | ||
| navigationStyle | String | default | 導(dǎo)航欄樣式孔飒，僅支持 default/custom灌闺。custom 模式可自定義導(dǎo)航欄，只保留右上角膠囊狀的按鈕 | 微信版本 6.6.0 |
| backgroundColor | HexColor | #ffffff | 窗口的背景色 | |
| backgroundTextStyle | String | dark | 下拉 loading 的樣式坏瞄，僅支持 dark/light | |
| backgroundColorTop | String | #ffffff | 頂部窗口的背景色桂对，僅 iOS 支持 | 微信版本 6.5.16 |
| backgroundColorBottom | String | #ffffff | 底部窗口的背景色，僅 iOS 支持 | 微信版本 6.5.16 |
| enablePullDownRefresh | Boolean | false | 是否開啟下拉刷新鸠匀，詳見頁面相關(guān)事件處理函數(shù) | |
| onReachBottomDistance | Number | 50 | 頁面上拉觸底事件觸發(fā)時距頁面底部距離蕉斜，單位為px |
tabBar
如果小程序是一個多 tab 應(yīng)用（客戶端窗口的底部或頂部有 tab 欄可以切換頁面），可以通過 tabBar 配置項指定 tab 欄的表現(xiàn)缀棍，以及 tab 切換時顯示的對應(yīng)頁面宅此。
Tip： 當設(shè)置 position 為 top 時，將不會顯示 icon
tabBar 中的 list 是一個數(shù)組爬范，只能配置最少2個父腕、最多5個 tab，tab 按數(shù)組的順序排序青瀑。
| 屬性 | 類型 | 必填 | 默認值 | 描述 |
|---|---|---|---|---|
| color | HexColor | 是 | tab 上的文字默認顏色 | |
| selectedColor | HexColor | 是 | tab 上的文字選中時的顏色 | |
| backgroundColor | HexColor | 是 | tab 的背景色 | |
| borderStyle | String | 否 | black | tabbar上邊框的顏色璧亮， 僅支持 black/white |
| list | Array | 是 | tab 的列表，詳見 list 屬性說明斥难，最少2個枝嘶、最多5個 tab | |
| position | String | 否 | bottom | 可選值 bottom、top |
注意：
跳過域名校驗
在微信開發(fā)者工具中哑诊，可以臨時開啟 開發(fā)環(huán)境不校驗請求域名群扶、TLS版本及HTTPS證書 選項，跳過服務(wù)器域名的校驗搭儒。此時穷当，在微信開發(fā)者工具中及手機開啟調(diào)試模式時，不會進行服務(wù)器域名的校驗淹禾。
點擊設(shè)置-項目設(shè)置勾選
