微信小程序生命周期

2019-02-12  本文已影响0人  这里王工头

欢迎访问我的博客,祝码农同胞们早日走上人生巅峰,迎娶白富美~~~

1 app.js生命周期

说到生命周期,无非就是创建、更新、销毁等阶段,类似于VueReact

下面是我在微信小程序开发者工具输入App()自动补全的信息,关于这些钩子函数的解释都自动注释了,十分方便

App({

  /**
   * 当小程序初始化完成时,会触发 onLaunch(全局只触发一次)
   */
  onLaunch: function () {
    
  },

  /**
   * 当小程序启动,或从后台进入前台显示,会触发 onShow
   */
  onShow: function (options) {
    
  },

  /**
   * 当小程序从前台进入后台,会触发 onHide
   */
  onHide: function () {
    
  },

  /**
   * 当小程序发生脚本错误,或者 api 调用失败时,会触发 onError 并带上错误信息
   */
  onError: function (msg) {
    
  }
})

2 页面Page生命周期

下面我们来看看页面的生命周期,同样的,写上Page()可以自动生成以下代码,其中钩子函数的解释也是直接注释好的

Page({

  /**
   * 页面的初始数据
   */
  data: {
    
  },

  /**
   * 生命周期函数--监听页面加载
   */
  onLoad: function (options) {
    
  },

  /**
   * 生命周期函数--监听页面初次渲染完成
   */
  onReady: function () {
    
  },

  /**
   * 生命周期函数--监听页面显示
   */
  onShow: function () {
    
  },

  /**
   * 生命周期函数--监听页面隐藏
   */
  onHide: function () {
    
  },

  /**
   * 生命周期函数--监听页面卸载
   */
  onUnload: function () {
    
  },

  /**
   * 页面相关事件处理函数--监听用户下拉动作
   */
  onPullDownRefresh: function () {
    
  },

  /**
   * 页面上拉触底事件的处理函数
   */
  onReachBottom: function () {
    
  },

  /**
   * 用户点击右上角分享
   */
  onShareAppMessage: function () {
    
  }
})

3 官网中关于App.js生命周期

生命周期回调函数写的很详细,推荐直接看官方文档

4 官网中页面生命周期

[图片上传失败...(image-aada22-1549985078260)]

5 参考文章

上一篇 下一篇

猜你喜欢

热点阅读