06 小程序的生命周期

定义段和示例方法:

        component构造器可用于自定义组件,调用Componet构造器可以指定组件的属性、数据和方法等。

image

       学习生命周期有助于我们理解小程序,例如什么时候,什么地方来发布异步请求,什么时候什么地方来关闭定时器,什么时候,什么地方来监听错误。生命周期参考小程序的运行周期。

1.应用生命周期

image

    应用生命周期其实指的是小程序的入口文件(也就是唯一的文件,应用生命周期说的就是app.js【全局入口文件】),大家对生命周期不要觉着陌生,其实生命周期就是一堆事件,只不过是应用第一次启动时候就会触发的事件,只是不是我们定义的。

       全局入口文件app.js内部最外面就是App({})。而页面最外层为Page({}),组件js文件是Componet({})

  • onlunch(){} 应用第一次启动时候,获取用户的个人信息
  • onShow(){} 应用会被客户看到,比onlaunch晚一步出发,例如切换页面会隐藏,对应用的数据、页面效果重置。
  • onhide(){}   应用会被隐藏,暂停或清除定时器
  • onerror(err){}  应用的代码发生了报错的时候,就会触发,通过异步请求,将错误的信息发送给后台
  • onPageNotFound(){}页面不存在监听函数,也是报错中的一种,应用第一次启动的时候,如果找不到入口页面,才会触发。(注意如果在app下面onlaunch里面注明了wx.navigato({页面}) 则不会报错,因为这个里面可能页面数据不对,不代表没有页面,入口页面在Pages里面)

      当然也可以找到页面时候,在这里指定跳转到的页面(不能是首页tabbar页面),与导航组件类似

      onPageNotFound(){

          wx:navigateTo({

              url:“pages/demo07/demo07” 

        })

     }


2.页面生命周期

     页面生命周期也是一系列的事件来完成的。

image

  • data:初始数据,是个对象,不是事件
  • onload:页面加载完毕后事件,类似于onlaunch,一般在此添加异步请求信息,完成页面初始化数据。
  • onShow:会在onload完成后,触发
  • onReady:在onshow之后,会触发
  • onHide:页面隐藏,不是应用隐藏,页面跳转后会隐藏。在onready之后触发
  • onUnLoad:页面卸载触发,也是可以通过点击超链接来展示。如redirect

,只要是关闭当前页面就是涉及到卸载一句话就是回不去了image


  • onPullDownRefresh:监听用户的下拉操作,类似于全局配置文件中做了下拉更新-app-json中enablePullDownRefresh:true,一般来说下拉刷新需要配置初始化数据,此时就用到onpullDownRefresh了。
  • onReachBottom:页面上拉触底事件的处理函数,切记这个里面需要让页面出现上下滚动才行,也就是确实有下一页内容才行,之后才产生触底,也就是做一个上拉加载下一页数据,在此处理。
  • onShareAppMessage:用户点击右上角转发触发的事件。
  • onPageScroll:表示的是页面滚动就可以触发,类似于上拉和下拉触更新一样。这是另外一种
  • onResize:表示页面的尺寸发生变化。一般是指小程序发生横屏或竖屏的切换的时候。例如在全局文件app.json文件中加上

                        {“pageOrientation”:“auto”},如果是希望仅当前页面支持横屏,则在当前页面的json文件中加上{“pageOrientation”:“auto”},加载后,则页面模拟器上多出一个手机摇一摇的类似按钮,点击即可横屏

  • onTabltemTab:当前页面是tab页时,点击tab时触发

页面生命周期图解




































posted @ 2020-10-27 16:26  芒果侠  阅读(125)  评论(0编辑  收藏  举报