小程序-生命周期(2) 应用周期/页面周期

一.应用周期

应用周期指的是小程序:启动->运行->销毁的整个过程。
应用周期伴随一些函数来进行控制,这些函数卸载app.js里面的App方法里。
分别由onLaunch, onShow,onHide依次进行。
onLaunch:初始化的时候运行(冷启动)
onShow:初始化准备好,展示页面的时候运行(热启动,后台切前台)
onHide:前台切后台
代码

// app.js
App({

  /**
   * 当小程序初始化完成时,会触发 onLaunch(全局只触发一次)
   */
  onLaunch: function () {
    console.log('onLaunch:冷启动时候触发')
  },

  /**
   * 当小程序启动,或从后台进入前台显示,会触发 onShow
   */
  onShow: function (options) {
    console.log('onShow:后台切换前台,热启动触发')
  },
    
  /**
   * 当小程序从前台进入后台,会触发 onHide
   */
  onHide: function () {
    console.log('onHide:页面到后台')
  },

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


二.页面周期

页面加载,运行,销毁的整个过程。
访问页面->onLoad(加载页面)-> onShow(展示页面)-> onReady(渲染完成)-> onUnload(页面卸载)
onShow<->onHide:前后台互相切换
定义在.js文件里的Page方法里

Page({

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

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

  /**
   * 生命周期函数--监听页面初次渲染完成
   */
  onReady: function () {
    console.log('onReady:页面准备妥当')
  },

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

  /**
   * 生命周期函数--监听页面隐藏
   */
  onHide: function () {
    console.log('onHide:当前页面被隐藏')
  },

  /**
   * 生命周期函数--监听页面卸载
   */
  onUnload: function () {
    console.log('onUnload:当前页面被卸载')
  },

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

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

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

三.注意事项

tabBar页面之间相互切换,页面不会被销毁,只会隐藏在后台。
也就是onShow<->onHide:前后台互相切换

使用 < navigator url=“/pages/list/list” open-type=“navigate” >组件,保留当前页面跳转到下一个页面,跳转完成,点击返回的时候,会销毁跳转的页面,即list页面。

相关推荐

  1. 程序-生命周期2应用周期/页面周期

    2024-06-18 19:32:02       5 阅读
  2. 程序生命周期以及页面生命周期

    2024-06-18 19:32:02       9 阅读
  3. 程序生命周期

    2024-06-18 19:32:02       37 阅读
  4. uniapp生命应用生命周期页面生命周期

    2024-06-18 19:32:02       25 阅读
  5. #Uniapp:页面生命周期&应用生命周期应用

    2024-06-18 19:32:02       38 阅读
  6. 程序生命周期

    2024-06-18 19:32:02       5 阅读
  7. uni-app的生命周期应用页面生命周期

    2024-06-18 19:32:02       10 阅读
  8. 程序应用页面、组件生命周期(超全版)

    2024-06-18 19:32:02       31 阅读
  9. Flutter页面生命周期

    2024-06-18 19:32:02       16 阅读

最近更新

  1. TCP协议是安全的吗?

    2024-06-18 19:32:02       18 阅读
  2. 阿里云服务器执行yum,一直下载docker-ce-stable失败

    2024-06-18 19:32:02       19 阅读
  3. 【Python教程】压缩PDF文件大小

    2024-06-18 19:32:02       18 阅读
  4. 通过文章id递归查询所有评论(xml)

    2024-06-18 19:32:02       20 阅读

热门阅读

  1. 航拍无人机像素坐标转世界坐标

    2024-06-18 19:32:02       6 阅读
  2. Spring (64)Spring框架如何处理异常

    2024-06-18 19:32:02       7 阅读
  3. 【名词解释】Unity3D中的“刚体移动”

    2024-06-18 19:32:02       8 阅读
  4. 树莓派和STM32的区别

    2024-06-18 19:32:02       7 阅读
  5. Redis 面试热点(二)

    2024-06-18 19:32:02       6 阅读
  6. 硬核科技集体暴涨,港股跟随美股步伐

    2024-06-18 19:32:02       7 阅读
  7. vue3-自定义指令来实现input框输入限制

    2024-06-18 19:32:02       7 阅读
  8. while和until语句

    2024-06-18 19:32:02       7 阅读
  9. PAT B1012. 数字分类

    2024-06-18 19:32:02       8 阅读
  10. Leetcode热题100

    2024-06-18 19:32:02       6 阅读
  11. 如何优化频繁的v-if造成的页面卡顿

    2024-06-18 19:32:02       8 阅读
  12. MyBatis中的延迟加载与分步查询总结

    2024-06-18 19:32:02       7 阅读
  13. DDL与DML语句

    2024-06-18 19:32:02       4 阅读