一、生命週期彙總
/**
* 頁面生命週期 - 監聽頁面加載
* @param {Object} options 傳遞過來的參數對象
*/
async onLoad(options) {},
/**
* 頁面生命週期 - 監聽頁面顯示（每次顯示時都會觸發）
*/
async onShow() {},
/**
* 頁面生命週期 - 監聽頁面初次渲染完成
*/
async onReady() {
// 加載數據
this.loadData();
},
/**
* 頁面生命週期 - 監聽頁面隱藏
*/
async onHide() {},
/**
* 頁面生命週期 - 監聽頁面卸載
*/
async onUnload() {},
/**
* 頁面生命週期 - 監聽窗口尺寸變化
* App、微信小程序
*/
async onResize() {},
/**
* 頁面生命週期 - 監聽用戶下拉動作
*/
async onPullDownRefresh() {
// 停止下拉刷新
uni.stopPullDownRefresh();
},
/**
* 頁面生命週期 - 頁面上拉觸底事件的處理函數
*/
async onReachBottom() {},
/**
* 頁面生命週期 - 點擊 tab 時觸發
* 微信小程序、百度小程序、H5、App（自定義組件模式）
* @param {String} event.index 被點擊tabItem的序號，從0開始
* @param {String} event.pagePath 被點擊tabItem的頁面路徑
* @param {String} event.text 被點擊tabItem的按鈕文字
*/
async onTabItemTap(event) {},
/**
* 頁面生命週期 - 用戶點擊右上角分享
* 微信小程序、百度小程序、字節跳動小程序、支付寶小程序
*/
async onShareAppMessage() {},
/**
* 頁面生命週期 - 監聽頁面滾動
* @param {Number} event.scrollTop 頁面在垂直方向已滾動的距離（單位px）
*/
async onPageScroll(event) {},
/**
* 頁面生命週期 - 監聽原生標題欄按鈕點擊事件
* 5+App、H5
* @param {Number} event.index 原生標題欄按鈕數組的下標
*/
async onNavigationBarButtonTap(event) {},
/**
* 頁面生命週期 - 監聽頁面返回
* App、H5
* @param {String} event.from 觸發返回行爲的來源：'backbutton'——左上角導航欄按鈕及安卓返回鍵；'navigateBack'——uni.navigateBack() 方法
* 注意事項：
* - 只有在該函數中返回值爲 true 時，才表示不執行默認的返回，自行處理此時的業務邏輯；
* - 不返回或返回其它值，均會執行默認的返回行爲；
* - H5 平臺，頂部導航欄返回按鈕支持 onBackPress()，瀏覽器默認返回按鍵及Android手機實體返回鍵不支持 onBackPress()；
*/
async onBackPress(event) {},
/**
* 頁面生命週期 - 監聽原生標題欄搜索輸入框輸入內容變化事件
* App、H5
*/
async onNavigationBarSearchInputChanged() {},
/**
* 頁面生命週期 - 監聽原生標題欄搜索輸入框搜索事件，用戶點擊軟鍵盤上的 "搜索" 按鈕時觸發
* App、H5
*/
async onNavigationBarSearchInputConfirmed() {},
/**
* 頁面生命週期 - 監聽原生標題欄搜索輸入框點擊事件
* App、H5
*/
async onNavigationBarSearchInputClicked() {},
二、pages.json 配置文件的屬性值
/**
* pages.json 文件用來對 uni-app 進行全局配置，決定頁面文件的路徑、窗口樣式、原生的導航欄、底部的原生tabbar 等
*/
{
// 設置默認頁面的窗口表現，用於設置應用的狀態欄、導航條、標題、窗口背景色等
"globalStyle": {
"navigationBarBackgroundColor": "#F8F8F8", // 導航欄背景顏色（同狀態欄背景色）。默認值："#F7F7F7"。平臺差異說明：APP與H5爲#F7F7F7，小程序平臺請參考相應小程序文檔
"navigationBarTextStyle": "black", // 導航欄標題顏色及狀態欄前景顏色，僅支持 black/white。默認值："white"
"navigationBarTitleText": "uni-app", // 導航欄標題文字內容
"navigationStyle": "default", // 導航欄樣式，僅支持 default/custom。custom即取消默認的原生導航欄。平臺差異說明：微信小程序 7.0+、百度小程序、H5、App（2.0.3+）
"backgroundColor": "#F8F8F8", // 窗口的背景色。默認值："#FFFFFF"。平臺差異說明：微信小程序
"backgroundTextStyle": "dark", // 下拉 loading 的樣式，僅支持 dark / light。默認："dark"。平臺差異說明：微信小程序
"enablePullDownRefresh": true, // 是否開啓下拉刷新。默認：false
"onReachBottomDistance": 50, // 頁面上拉觸底事件觸發時距頁面底部距離，單位只支持px。默認：50
"backgroundColorTop": "#FFFFFF", // 頂部窗口的背景色（bounce回彈區域）。默認值："#FFFFFF"。平臺差異說明：僅 iOS 平臺
"backgroundColorBottom": "#FFFFFF", // 底部窗口的背景色（bounce回彈區域）。默認值："#FFFFFF"。平臺差異說明：僅 iOS 平臺
"titleImage": "", // 導航欄圖片地址（替換當前文字標題），支付寶小程序內必須使用https的圖片鏈接地址。默認：""。平臺差異說明：支付寶小程序、H5、APP
"transparentTitle": "none", // 導航欄透明設置。支持 always 一直透明 / auto 滑動自適應 / none 不透明。默認："none"。平臺差異說明：支付寶小程序、H5、APP
"titlePenetrate": "NO", // 導航欄點擊穿透。默認："NO"。平臺差異說明：支付寶小程序、H5
"pageOrientation": "portrait", // 屏幕旋轉設置，僅支持 auto / portrait。默認："portrait"。平臺差異說明：微信小程序
"animationType": "pop-in", // 窗口顯示的動畫效果。默認："pop-in"。可選的值：slide-in-right、slide-in-left、slide-in-top、slide-in-bottom、pop-in、fade-in、zoom-out、zoom-fade-out、none。平臺差異說明：APP
"animationDuration": 300, // 窗口顯示動畫的持續時間，單位爲 ms。默認：300。平臺差異說明：APP
"app-plus": {}, // 設置編譯到 App 平臺的特定樣式。平臺差異說明：APP
"h5": {}, // 設置編譯到 H5 平臺的特定樣式。平臺差異說明：H5
"mp-alipay": {}, // 設置編譯到支付寶小程序的特定樣式。平臺差異說明：支付寶小程序
"mp-weixin": {}, // 設置編譯到微信小程序的特定樣式。平臺差異說明：微信小程序
"mp-baidu": {}, // 設置編譯到百度小程序的特定樣式。平臺差異說明：百度小程序
"mp-toutiao": {}, // 設置編譯到字節跳動小程序的特定樣式。平臺差異說明：字節跳動小程序
"mp-qq": {}, // 設置編譯到QQ小程序的特定樣式。平臺差異說明：QQ小程序
"usingComponents": {} // 引用小程序組件。平臺差異說明：微信小程序、App
},
// 設置頁面路徑及窗口表現。數組中第一項表示應用啓動頁
"pages": [{
"path": "pages/index/index",
"style": {
"navigationBarTitleText": "首頁"
}
}, {
"path": "pages/biaofun-region/biaofun-region",
"style": {
"navigationBarTitleText": "省市區選擇器"
}
}, {
"path": "pages/biaofun-datetime-picker/biaofun-datetime-picker",
"style": {
"navigationBarTitleText": "日期時間選擇器"
}
}, {
"path": "pages/biaofun-waterfall/biaofun-waterfall",
"style": {
"navigationBarTitleText": "瀑布流佈局"
}
}, {
"path": "pages/biaofun-swiper-list/biaofun-swiper-list",
"style": {
"navigationBarTitleText": "滑動列表",
"enablePullDownRefresh": false
}
}, {
"path": "pages/biaofun-loading-more/biaofun-loading-more",
"style": {
"navigationBarTitleText": "加載更多"
}
}, {
"path": "pages/biaofun-marquee/biaofun-marquee",
"style": {
"navigationBarTitleText": "跑馬燈"
}
}]
}