微信小程序day01_07之小程序的生命周期

Bertha 。 2022-03-15 15:21 176阅读 0赞

### 文章目录 ###

*   *   *  一. 生命周期回调函数的介绍
         *  二. 生命周期函数的代码示例

本文代码地址 [https://gitee.com/jaythc/wxxcx\_learen/tree/master/day01/day01\_07/my-first-demo][https_gitee.com_jaythc_wxxcx_learen_tree_master_day01_day01_07_my-first-demo]

### 一. 生命周期回调函数的介绍 ###

onLaunch(在微信官方文档中, 已经改成了onLoad): 第一次打开小程序的时候, onLaunch事件会被触发, 并且只会调用一次.

onShow: 会随着onlanuch一起触发, 小程序在前台打开时, 会展现的方法

onHide : 小程序从前台转到后台了, 就会触发此事件.

onError: 小程序出错的时候, 触发此事件. 类似于java的异常.

其他: 开发者可以添加任意的函数或数据到 Object 参数中，在页面的函数中用 this 可以访问

在小程序官方文档的 框架—> 注册页面中, 有对生命周期的方法,进行一些介绍.  
[https://developers.weixin.qq.com/miniprogram/dev/framework/app-service/page.html][https_developers.weixin.qq.com_miniprogram_dev_framework_app-service_page.html]  
![watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3FxXzMzMjI5NjY5_size_16_color_FFFFFF_t_70][]

### 二. 生命周期函数的代码示例 ###

在全局的app.js中,编写如下的内容

//app.js
    App({ 
      //打开微信小程序时,触发的onLaunch函数
      onLaunch(options){ 
        console.log("触发 onLaunch")
      },
      onShow() { 
        console.log("触发 onShow")
      },
      onHide() { 
        console.log("触发 onHide")
      },
      courseName: '小程序实战'
    })

当运行小程序时, 控制台打印如下, 说明了开启小程序时,会触发onLaunch事件一次, 并且会触发onShow一次, 如果把小程序切换后台了,那么会触发onHide事件  
![watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3FxXzMzMjI5NjY5_size_16_color_FFFFFF_t_70 1][]

全局参数的应用  
在上面的app.js中, 定义了`courseName`全局参数,  
在index.js中使用如下, 在onLoad函数中, 通过getApp() 获取小程序的实例, 通过该实例获取全局参数, 并把该参数用set方法,绑定到页面中

Page({ 
      // data为数据绑定
      data: { 
        mytext: '第一个demo',
        color: "red"
      },
      onLoad: function () { 
        // getApp 为获取小程序的实例
        var appInstance = getApp();
        // appInstance.courseName 为获取自定义的参数
        console.log(appInstance.courseName);
        this.setData({ 
          mytext: appInstance.courseName
        })
      }
    })

页面中显示的效果如下  
![watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3FxXzMzMjI5NjY5_size_16_color_FFFFFF_t_70 2][]

[https_gitee.com_jaythc_wxxcx_learen_tree_master_day01_day01_07_my-first-demo]: https://gitee.com/jaythc/wxxcx_learen/tree/master/day01/day01_07/my-first-demo
[https_developers.weixin.qq.com_miniprogram_dev_framework_app-service_page.html]: https://developers.weixin.qq.com/miniprogram/dev/framework/app-service/page.html
[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3FxXzMzMjI5NjY5_size_16_color_FFFFFF_t_70]: /images/20220315/6d2894622fd545e0a055c423e591c6dc.png
[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3FxXzMzMjI5NjY5_size_16_color_FFFFFF_t_70 1]: /images/20220315/be2c925058984ac1863a4051f534ba19.png
[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3FxXzMzMjI5NjY5_size_16_color_FFFFFF_t_70 2]: /images/20220315/7befde05713c4bf99b9ad051c5ca588e.png