微信小程序Taro開發(2)：生命周期及開發中注意點

morgan 發布于2019-08-23 14:09 / 2443人閱讀

摘要：入口文件繼承自組件基類，它同樣擁有組件生命周期，但因為入口文件的特殊性，他的生命周期并不完整，如。支持組件化開發，組件代碼可以放在任意位置，不過建議放在下的目錄中。

生命周期 componentWillMount

在微信小程序中這一生命周期方法對應頁面的onLoad或入口文件app中的onLaunch

componentDidMount

在微信小程序中這一生命周期方法對應頁面的onReady或入口文件app中的onLaunch，在 componentWillMount后執行

componentDidShow

在微信小程序中這一生命周期方法對應 onShow

componentDidHide

在微信小程序中這一生命周期方法對應 onHide

componentDidCatchError

錯誤監聽函數，在微信小程序中這一生命周期方法對應 onError

componentDidNotFound

頁面不存在監聽函數，在微信小程序中這一生命周期方法對應 onPageNotFound

shouldComponentUpdate

頁面是否需要更新

componentWillUpdate

頁面即將更新

componentDidUpdate

頁面更新完畢

componentWillUnmount

頁面退出，在微信小程序中這一生命周期方法對應 onUnload

在小程序中，頁面還有一些專屬的方法成員，如下：

1. onPullDownRefresh： 頁面相關事件處理函數--監聽用戶下拉動作

2. onReachBottom： 頁面上拉觸底事件的處理函數

3. onShareAppMessage： 用戶點擊右上角轉發

4. onPageScroll： 頁面滾動觸發事件的處理函數

5. onTabItemTap： 當前是 tab 頁時，點擊 tab 時觸發

6. componentWillPreload： 預加載，只在微信小程序中可用

注意

1.通常入口文件會包含一個 config 配置項，這里的配置主要參考微信小程序的全局配置而來，在編譯成小程序時，這一部分配置將會被抽離成 app.json，而編譯成其他端，亦會有其他作用。

2.入口文件繼承自 Component 組件基類，它同樣擁有組件生命周期，但因為入口文件的特殊性，他的生命周期并不完整，如：componentWillMount、componentDidMount、componentDidShow、componentDidHide、componentDidCatchError、componentDidNotFound。

3.入口文件需要包含一個 render 方法，一般返回程序的第一個頁面，但值得注意的是不要在入口文件中的 render 方法里寫邏輯及引用其他頁面、組件，因為編譯時 render 方法的內容會被直接替換掉，你的邏輯代碼不會起作用。

4.Taro 支持組件化開發，組件代碼可以放在任意位置，不過建議放在 src 下的 components 目錄中。一個組件通常包含組件 JS 文件以及組件樣式文件，組織方式與頁面類似。

taro項目目錄如下:

├── config                 配置目錄
|   ├── dev.js             開發時配置
|   ├── index.js           默認配置
|   └── prod.js            打包時配置
├── src                    源碼目錄
|   ├── components         公共組件目錄
|   ├── pages              頁面文件目錄
|   |   ├── index          index 頁面目錄
|   |   |   ├── banner     頁面 index 私有組件
|   |   |   ├── index.js   index 頁面邏輯
|   |   |   └── index.css  index 頁面樣式
|   ├── utils              公共方法庫
|   ├── app.css            項目總通用樣式
|   └── app.js             項目入口文件
└── package.json

云服務器 GPU云服務器微信小程序免費開發微信小程序怎樣開發微信小程序的開發微信小程序怎么開發

文章版權歸作者所有，未經允許請勿轉載,若此文章存在違規行為，您可以聯系管理員刪除。

轉載請注明本文地址：http://m.specialneedsforspecialkids.com/yun/100163.html

Taro 簡介

摘要：讓人又愛又恨的微信小程序自微信小程序以下簡稱小程序誕生以來，就伴隨著贊譽與爭議不斷。同時于開發者來說，小程序的生態不斷在完善，許多的坑已被踩平，雖然還是存在一些令人詬病的問題，但已經足見微信的誠意了。 Taro 介紹在互聯網不斷發展的今天，前端程序員們也不斷面臨著新的挑戰，在這個變化多端、不斷革新自己的領域，每一年都有新的美好事物在發生。從去年微信小程序的誕生，到今年的逐漸火熱，以及...

sixgo 2019-08-23 16:18 評論0 收藏0
開源中國專訪：Chameleon原理首發，其它跨多端統一框架都是假的？

摘要：中國互聯網絡信息中心發布的中國互聯網絡發展狀況統計報告顯示，截至年月，我國網民規模達億人，微信月活億支付寶月活億百度月活億另一方面，中國手機占智能手機整體的比例超過，月活約億。在年末正式發布了面向未來的跨端的。開源中國專訪：Chameleon原理首發，其它跨多端統一框架都是假的？原創：嘉賓-張楠開源中國以往我們說某一功能跨多端，往往是指在諸如 PC、移動等不同類型的設備之...

GraphQuery 2019-08-23 15:29 評論0 收藏0
Taro，快速上手教程（一）

摘要：個人所有文章同步到前言最近公司準備開發幾款可以在微信小程序端和端同時運行的一套商城，接著就是任務下發嘍，但是有一點，時間緊任務重，直接說其他的不管，反正幾個星期之內必須上線，頭疼。個人所有文章同步到：https://github.com/zhengzhuan... 前言最近公司Boss準備開發幾款可以在微信小程序端和H5端同時運行的一套商城，接著就是任務下發嘍，但是有一點，時間緊任...

pakolagij 2019-08-23 12:28 評論0 收藏0
Taro 優秀學習資源匯總

摘要：多端統一開發框架優秀學習資源匯總官方資源項目倉庫官方文檔項目倉庫官方文檔微信小程序官方文檔百度智能小程序官方文檔支付寶小程序官方文檔字節跳動小程序官方文檔文章教程不敢閱讀包源碼帶你揭秘背后的哲學從到構建適配不同端微信小程序等的應用小程序最 Awesome Taro 多端統一開發框架 Taro 優秀學習資源匯總 showImg(https://segmentfault.com/img/r...

toddmark 2019-08-23 18:02 評論0 收藏0