(四)小程序的生命周期及页面

小程序的生命周期及页面(四)

小程序生命周期和页面的生命周期 ，这两个其实应该是不同却又相互关联的生命周期

小程序的生命周期:

首先小程序的生命周期函数是在app.js里面调用的，App(Object)函数用来注册一个小程序。接受一个 Object 参数，指定其小程序的生命周期回调；
一般有以下这几个函数,
onLaunch监听小程序初始化、
onShow监听小程序显示、
onHide监听小程序隐藏等生命周期回调函数。

从中我们可以知道小程序的生命周期函数的调用顺序为：onLaunch>onShow>onHide

onLaunch() {
  console.log('onLaunch监听小程序初始化---小程序进入初始化的时候 只执行一次');
}

onShow() {
  console.log('onShow监听小程序显示--- 小程序进入后台进入前台的时候');
}

onHide() {
  console.log('onLaunch监听小程序隐藏 --- 小程序进入后台的时候进行触发');
}

页面的生命周期:

页面生命周期函数就是当你每进入/切换到一个新的页面的时候，就会调用的生命周期函数。Page(Object) 函数用来注册一个页面。接受一个Object类型参数，其指定页面的初始数据、生命周期回调、事件处理函数等。

  onLoad(options) {
    console.log('onLoad监听页面加载');
  }

  onReady() {
    console.log('onReady监听页面初次渲染完成');
  }

  onShow() {
    console.log('onShow监听页面显示');
  }

  onHide() {
    console.log('onHide监听页面隐藏');
  }

  onUnload() {
    console.log('onUnload监听页面卸载');
  }

效果展示:

小程序的生命周期函数的调用顺序为：onLoad>onShow>onReady。
至于onHide函数就是当隐藏页面的时候触发

注意:

由此我们知道了小程序程序生命周期函数和页面生命周期函数的调用顺序，这两者之间的事件顺序一般如上图所示小程序周期函数在前，页面周期函数触发在后。

但是这不是绝对的，比如，有时候就会存在页面onLoad函数比小程序app的onLaunch生命周期函数先调用的情况，那么这时候就可以用回调的方式的来处理。