微信小程序的生命周期的詳解
今天記錄一下微信小程序的app生命周期及各頁面的生命周期。
（一）小程序的生命周期
在app.json中進(jìn)行監(jiān)聽，三個方法
①onLauch方法只在小程序啟動時觸發(fā)一次。
②onShow方法，在小程序啟動時，及由后臺切換至前臺顯示時觸發(fā)。
③onHide方法，在小程序由前臺顯示切換至后臺時觸發(fā)。
可以通過 ↓ 這張圖片，感受一下各生命周期。
比較有趣的地方是，小程序啟動時會觸發(fā)兩次onShow，我不知道是為什么。希望了解的同學(xué)解釋一下。
（二）頁面的生命周期
1.在index中我添加了兩種方式跳轉(zhuǎn)到新增的crab頁面 ↓ 在這里簡單介紹一下
①在index.wxml文件中通過在<navigator>標(biāo)簽中添加url實(shí)現(xiàn)跳轉(zhuǎn)
②將button綁定到index.js中的方法實(shí)現(xiàn)跳轉(zhuǎn)，此處我將方法命名為turnCrabFunction,并在index.js中實(shí)現(xiàn)該方法。
2.下面介紹crab.js中的各生命周期
↓圖為該文件部分代碼，使用console.log進(jìn)行打印，方便我們進(jìn)行觀察各生命周期。（各函數(shù)后面注釋對應(yīng)功能說明。）
其中，onSomeFunction是我隨意命名的，其他方法均有固定名字及含義。
3.在index界面，我們選擇任意一種方式進(jìn)入crab界面。↓圖進(jìn)行詳細(xì)說明
（如果無法實(shí)現(xiàn)下拉刷新，請檢查app.json中window參數(shù)，或檢查當(dāng)前頁面的crab.json文件是否覆蓋該參數(shù)為false）
如有疑問請留言或者到本站社區(qū)交流討論，感謝閱讀，希望能幫助到大家，謝謝大家對本站的支持！
相關(guān)文章
JS處理數(shù)據(jù)實(shí)現(xiàn)分頁功能
這篇文章介紹了JS處理數(shù)據(jù)實(shí)現(xiàn)分頁功能的方法，文中通過示例代碼介紹的非常詳細(xì)。對大家的學(xué)習(xí)或工作具有一定的參考借鑒價值，需要的朋友可以參考下2022-01-01
這篇文章主要為大家介紹了微前端框架qiankun的源碼剖析，有需要的朋友可以借鑒參考下，希望能夠有所幫助，祝大家多多進(jìn)步，早日升職加薪2023-02-02
TS?項(xiàng)目中高效處理接口返回?cái)?shù)據(jù)方法詳解
這篇文章主要為大家介紹了TS?項(xiàng)目中如何高效的處理接口返回的數(shù)據(jù)的方法詳解，有需要的朋友可以借鑒參考下，希望能夠有所幫助，祝大家多多進(jìn)步，早日升職加薪2023-01-01
DOM，即文檔對象模型，前端開發(fā)工程師必學(xué)的基礎(chǔ)知識，在本文將介紹如何在 HTML 文檔中選擇元素、如何創(chuàng)建元素、如何更改內(nèi)聯(lián) CSS 樣式以及如何監(jiān)聽事件,需要的朋友可以參考一下2021-10-10
這篇文章主要介紹了vue axios請求超時,設(shè)置重新請求的完美解決方法,一并給大家介紹了axios基本用法，需要的朋友可以參考下2018-04-04
JS前端實(shí)現(xiàn)fsm有限狀態(tài)機(jī)實(shí)例詳解
這篇文章主要為大家介紹了JS前端實(shí)現(xiàn)fsm有限狀態(tài)機(jī)實(shí)例詳解，有需要的朋友可以借鑒參考下，希望能夠有所幫助，祝大家多多進(jìn)步，早日升職加薪2022-09-09
這篇文章主要為大家介紹了JS前端可視化GraphQL使用詳解，有需要的朋友可以借鑒參考下，希望能夠有所幫助，祝大家多多進(jìn)步，早日升職加薪2022-08-08
這篇文章主要為大家介紹了JSON?Schema概念及使用場景示例詳解，有需要的朋友可以借鑒參考下，希望能夠有所幫助，祝大家多多進(jìn)步，早日升職加薪2022-07-07
You-Dont-Know-JS詞法作用域及兩種常見的模型學(xué)習(xí)文檔
這篇文章主要為大家介紹了JS?詞法作用域及兩種常見的模型詳解，有需要的朋友可以借鑒參考下，希望能夠有所幫助，祝大家多多進(jìn)步，早日升職加薪2023-08-08
Css-In-Js實(shí)現(xiàn)classNames庫源碼解讀
這篇文章主要為大家介紹了Css-In-Js實(shí)現(xiàn)classNames庫源碼解讀，有需要的朋友可以借鑒參考下，希望能夠有所幫助，祝大家多多進(jìn)步，早日升職加薪2022-12-12