微信小程序 | 12.生命周期、globalData全局数据

1.小程序的生命周期

小程序生命周期(onLaunch、onShow、onHide、onReady、onLoad、onUnload)

这篇文章讲得非常详细。

执行顺序是：onLaunch => onLoad => onShow => onReady => onHide

2.全局数据globalData

在app.js中定义了globalData，其中有userOpenId、userNickName等属性。

随后在需要用到这些数据的地方，调用getApp( ).globalData.属性名即可获取

3.globalData的应用

3.1.搭配app.js的onLaunch()存储openid

上篇文章说到通过wx.login()获取code，再用code换取openid。

而通常wx.login()会写在app.js的==onLaunch()==中(小程序初始化完成后执行)，当执行得到openid后，存储到globalData中以便调用。

或者是取得openid后进一步发送请求到后端数据库，根据openid判断该用户是否首次登录、数据库是否拥有数据等。

3.2.轮询globalData

3.2.1.问题描述

在app.js中，globalData定义了userNickName和userAvatarUrl变量。而在onLaunch中获取到openid后，进一步向后端发送请求访问数据库，获取数据并对这两个变量赋值。

假如在一个页面的onLoad中，希望从globalData中获取userNickName，但此时还未从数据库中查出数据，此时该页面只能拿到globalData的默认值。

虽然说其他页面的onLoad会在onLaunch执行完毕后方才执行，但发送请求是异步的，因此还没等到后端返回响应，将值赋给globalData，onLoad就已经被执行了。

如上，还没等app.js的onLaunch将值赋给globalData，另一个页面便已经从globalData完成了取值，此时便会出现错误。

3.2.2.解决方式：轮询globalData

当然也可以在onLoad中发起请求访问数据库。但既然globalData已经有数据，咱就用起来。

在微信小程序中有定时器，代码如下：

// 定义名为"a"的定时器，有两个参数：
// 第一个参数是执行的函数，第二个参数是间隔的时间（0.2s）
let a = setInterval(() => {
    if(终止条件){
        // 终止定时器
        clearInterval(a);
    }
}, 200)

据此，可以用定时器来轮询globalData，假设：

• userNickName默认值为""
• 当后端响应完毕，小程序会将globalData的userNickName设置为"zs"

// 页面加载时调用，一个页面只会调用一次
onLoad(){
    let userNickName;
    let a = setInterval(() => {
        // 当globalData的userNickName不再是默认值，说明已获取响应并完成赋值
        if(getApp().globalData.userNickName !== ""){
            userNickName = getApp().globalData.userNickName;
            // 终止定时器
            clearInterval(a);
        }
		}, 200)
    // 输出一下userNickName
    console.log(userNickName);
}