基础学习微信小程序之注册页面

注册过小程序之后，接下来注册页面。

代码说明

//index.js
//获取应用实例
var app = getApp()
Page({
    data: {
        motto: 'Hello World',
        userInfo: {}

    },
  

    //事件处理函数
    bindViewTap: function() {
        wx.navigateTo({
             url: '../logs/logs'
        })
    },
   

    onLoad: function () {
        console.log('onLoad')
        var that = this
        //调用应用实例的方法获取全局数据
        app.getUserInfo(function(userInfo){
            //更新数据
            that.setData({
                userInfo:userInfo
            })
        })
     }
})

Page函数

Page() 函数接受一个 object 参数，用来注册一个页面。它可以指定页面的初始数据、生命周期函数、事件处理函数等。

初始化数据

data属性指定的数据在页面第一次描画时使用。本例中定义了两个数据：motto和userinfo。

事件处理

bindViewTap函数是在index.wxml中绑定到用户信息表示容器上的。每当用户点击该容器，这个函数就会被调用。它的内容很简单，就是迁移到log画面。

生命周期函数

本例中注册了onLoad函数，它会在页面加载时自动调用。

onLoad函数以函数对象为参数调用app.getUserInfo函数。而这个函数对象以userinfo为参数，功能是将userinfo设置到页面数据的userinfo对象上。

JavaScript知识

在调用app.getUserInfo传递了一个匿名的函数对象。这个对象至少有两点是C程序员不习惯的。

this和that

代 码中首先定义了一个that变量并将this赋值给它，然后使用that调用setData函数。这么做是因为javascript的this指针指向的 是调用函数的上下文。而这个函数在app.getUserInfo中调用，所以不能直接使用this，而只能使用事先准备好，指向本页面对象的that。

函数对象

在app.js中，作为参数传递给getUserInfo的函数对象cb是这样被调用的：

typeof cb == "function" && cb(this.globalData.userInfo)

我们可 以用&&符号将表达式分为两部分，左边是取得cb的类型，确认是否是"function”，如果是则继续执行右半部分，以 this.globalData.userInfo为参数调用cb函数；如果cb的类型不是"function"，因为表达式已经为假，所以不会调用cb 函数。

换一种写法，其实就是：

if(typeof cb == "function")

{

    cb(this.globalData.userInfo)

}

参考资料

关于this对象