微信小程序页面生命周期

• onLoad(Object query)

  页面加载时触发。一个页面只会调用一次，可以在 onLoad 的参数中获取打开当前页面路径中的参数。
  可以获取wx.navigateTo和wx.redirectTo及<navigator/>中的 query。

  //url wxml页面
  <button bindtap='clickme'>点击跳转到生命周期页</button>
  
  //url页面点击按钮跳转(js）
  clickme:function(){
      wx.navigateTo({
        url:'../lifeperiod/lifeperiod?id=10086'
      })
    }
  
  //lifeperiod页面获取当前页面参数(js）
  onLoad: function (option) {
      console.log(option.id)
    },

• onShow

  页面显示/切入前台时触发。

//wxml
<text>{{showme}}</text>
//js
onReady: function () {
    console.log("onReady-test")
    this.setData({
      showme: "loveweiwei"
    })
},
onShow: function () {
    console.log("onShow-test");
    this.setData({
      showme: "loveme"
    })
}

猜猜显示loveme还是loveweiwei?

onShow监听页面显示比onReady函数监听页面初次渲染完成先调用

• onReady

  页面初次渲染完成时触发。一个页面只会调用一次，代表页面已经准备妥当，可以和视图层进行交互。

• onHide

  页面隐藏/切入后台时触发。 如 navigateTo 或底部 tab 切换到其他页面，小程序切入后台等。
  从url页面跳转到lifeperiod页面，会触发url页面的onHide。

• onUnload

  页面卸载时触发。如redirectTo或navigateBack到其他页面时。
  从lifeperiod页面返回url页面，会触发lifeperiod页面的onUnload。

注意：返回url页面时显示loveme,是因为onReady为监听页面初次渲染完成触发