小程序中生命周期的解析（附代码）

本篇文章给大家带来的内容是关于小程序中生命周期的解析（附代码），有一定的参考价值，有需要的朋友可以参考一下，希望对你有所帮助。

原因是 :  整个小程序应用有2个线程.

• 一个线程做视图渲染.

• 一个线程做逻辑处理.
  这样你差不多应该清楚了 : wxml和wxss文件主要做视图展示,而js文件主要是做响应事件的逻辑处理,分工明确!

其次,我们再来分析:我们使用小程序会发现有很多的页面,那么谁来管理这些页面呢?页面和整个程序之间又是个什么样儿的关系呢?

• [x] 一个app,有app和pages构成,有着不同的生命周期

• app
  一个程序启动后,执行onlaunch—>onshow

app({
  onlaunch: function () {
  },
  onshow: function (options) {
  },
  onhide: function () {
  },
  onerror: function (msg) {
  }
})

• pages
  一个程序启动后,执行onlaunch—>onshow后,接着加载首页;加载首页onload—>onshow—>onready

page({
  data: {
  },
  onload: function (options) {
  },
  onready: function () {
  },
  onshow: function () {
  },
  onhide: function () {
  },
  onunload: function () {
  },
  onpulldownrefresh: function () {
  },
  onreachbottom: function () { 
  },
  onshareappmessage: function () {
  }
})

此时,你已经看到了渲染好的首页了!

如果此时,你想看下你的帅帅的或者美美的自拍照,按下了home键或者点击了右上角的退出小圆圈,此时小程序发生了什么呢?
 - 首页加载 onlaunch—>onshow—>onload—>onshow—>onready  加载完成
 - 执行退出,小程序其实是执行了onhide(page的onhide)—>onhide(app的onhide)
 如果你欣赏完自拍照后,你又想起了刚才的小程序,又感兴趣想瞅瞅,咋办呢?打开呗!打开之后,想想小程序会做什么呢?难道重新加载么?
 - no no no!如果你的自拍欣赏时间不是很长,或者内存十分足够小程序呆一会的话,小程序只需要被唤醒一下就好喽!^.^
 - onlaunch—>onshow—>onload—>onshow—>onready—>onhide(page)—>onhide(app)这是刚才加载好首页,又退出后的生命线,此时如果你又进来了,那么程序将会这样走:onshow(app)—>onshow(page)

这个时候,对于一个页面的基本加载,应该没啥问题了吧

• 原来页面:onhide

• 新的页面:onload—>onshow—>onready

• 原来页面:onunload

• 新的页面:onload—>onshow—>onready

• 新的页面:onunload

• 原来页面:onshow

• 新的页面:onhide

• 原来页面: 情景1(已加载):onshow   情景2(未加载):onload—>onshow—>onready