美文网首页
【小程序】小程序生命周期与页面生命周期

【小程序】小程序生命周期与页面生命周期

作者: 灰灰手记 | 来源:发表于2018-11-16 16:16 被阅读37次

【小程序】笔记内容声明及汇总


小程序生命周期

前面说过小程序根目录下有一个 app.js 文件,这个文件的位置和名字都是不能改的,原因就在于它里面会调用 App() 函数。而 App() 必须在 app.js 中调用,且只能调用一次,不然会出现无法预期的后果。

App() 函数用来注册一个小程序,接受一个 Object 参数,其指定小程序的生命周期回调等,参数说明如下:

  • onLaunch(Object) 监听小程序初始化
    小程序初始化完成时(全局只触发一次)。

  • onShow(Object) 监听小程序显示
    小程序启动,或从后台进入前台显示时。Object 参数与 onLaunch 一致。

前台、后台定义
当用户点击左上角关闭,或者按了设备 Home 键离开微信,小程序并没有直接销毁,而是进入了后台;当再次进入微信或再次打开小程序,又会从后台进入前台。需要注意的是:只有当小程序进入后台一定时间,或者系统资源占用过高,才会被真正的销毁。

  • onHide() 监听小程序隐藏
    小程序从前台进入后台时。

  • onError(String error) 错误监听函数
    小程序发生脚本错误,或者 api 调用失败时触发,会带上错误信息。

  • onPageNotFound(Object) 页面不存在监听函数
    小程序要打开的页面不存在时触发,会带上页面信息回调该函数。

说明:
1、基础库 1.9.90 开始支持,低版本需做兼容处理
2、开发者可以在 onPageNotFound 回调中进行重定向处理,但必须在回调中同步处理,异步处理(例如 setTimeout 异步执行)无效。
3、如果开发者没有添加 onPageNotFound 监听,当跳转页面不存在时,将推入微信客户端原生的页面不存在提示页面。
4、如果 onPageNotFound 回调中又重定向到另一个不存在的页面,将推入微信客户端原生的页面不存在提示页面,并且不再回调 onPageNotFound。

除以上这些函数外,开发者还可以添加任意的函数或数据到 Object 参数中,用 this可以访问。


页面生命周期

页面的生命周期函数在页面的 js 文件中,该文件中 Page(Object) 函数用来注册一个页面,它接受一个 Object 类型参数,其指定页面的初始数据生命周期回调事件处理函数等。

当我们采用之前所提到的“一步到位”的页面新建方法创建页面时,开发工具会自动将相关生命周期函数带出来,这些函数及功能如下:

  • onLoad(Object query) 页面加载
    一个页面只会调用一次,可以在 onLoad 的参数中获取打开当前页面路径中的参数。

  • onShow() 页面显示/切入前台
    onHideonShow 在一次生命周期内可能会执行多次。

  • onReady() 页面初次渲染完成
    一个页面只会调用一次,代表页面已经准备妥当,可以和视图层进行交互。

除了第一次渲染,页面还有可能会渲染多次。数据更新也会造成页面的重新渲染。小程序仅在第一次渲染完成后,提供了监听函数 onReady,对于以后的渲染并没有提供相应的监听函数。所以,onReady 仅用来监听“第一渲染”完成。

  • onHide() 页面隐藏/切入后台
    navigateTo 或底部 tab 切换到其他页面,小程序切入后台等。
    onHideonShow 在一次生命周期内可能会执行多次。

  • onUnload() 页面卸载
    redirectTonavigateBack 到其他页面时。

注意

1、正确的是先 onShow 再 onReady,但是开发工具自动生成的代码中 onReady 在 onShow 上面,是错的,不要被误导了。
2、对界面内容进行设置的 API 如 wx.setNavigationBarTitle,请在onReady之后进行。

相关文章

  • 小程序-生命周期

    小程序生命周期 页面生命周期

  • 前端理论面试-小程序

    小程序生命周期 小程序生命周期分为应用、页面和组件三个部分 应用的生命周期App() 函数用来注册一个小程序。接受...

  • 微信小程序之生命周期(四)

    微信小程序生命周期分类: 应用生命周期 页面生命周期 一、应用生命周期 App() 函数用来注册一个小程序。接受一...

  • 微信小程序生命周期

    1.小程序的生命周期 2.页面的生命周期 3.组件的生命周期 4.组件所在页面的生命周期

  • uni-app 微信小程序学习笔记

    微信小程序的生命周期函数 应用的生命周期。onLaunchonShowonHideonError 页面的生命周期o...

  • 生命周期

    小程序生命周期 小程序注册完成后,加载页面,触发onLoad方法。 页面载入后触发onShow方法,显示页面。 首...

  • mpvue 切换页面数据没清空问题

    加载页面的时候,小程序生命周期重置data数据

  • 微信小程序之生命周期

    由于小程序分为应用和页面两个部分,所以小程序的生命周期就涉及到以下部分。 分别是: 应用的生命周期。 页面的生命周...

  • 【小程序】生命周期

    小程序生命周期分为两类:应用生命周期和页面生命周期。 应用生命周期 应用生命周期包括onLaunch、onShow...

  • 微信小程序(二)

    一、小程序全局生命周期钩子: 二、 页面生命周期钩子 三、页面跳转 open-type值: js方式:

网友评论

      本文标题:【小程序】小程序生命周期与页面生命周期

      本文链接:https://www.haomeiwen.com/subject/utvpfqtx.html