微信小程序学习 - 程序、页面注册及生命周期

文章转载来自：http://blog.csdn.net/hedong_77/article/details/54667827

=============================================

程序注册

App() 

App() 函数用来注册一个小程序。接受一个 object 参数，其指定小程序的生命周期函数等。 
object参数说明： 



前台、后台定义： 当用户点击左上角关闭，或者按了设备 Home 键离开微信，小程序并没有直接销毁，而是进入了后台；当再次进入微信或再次打开小程序，又会从后台进入前台。

只有当小程序进入后台一定时间，或者系统资源占用过高，才会被真正的销毁。 
示例代码：

App({
onLaunch: function() {
// 做一些初始化操作
},
onShow: function() {
// 当页面显示的时候可以做一些操作
},
onHide: function() {
// 当页面隐藏的时候可以做一些操作
},
onError: function(msg) {
console.log(msg)
},
globalData: 'I am global data'
})

那怎么获取APP实例呢，在相应的Page里面通过getApp()获取，如下：

// main.js
var appInstance = getApp()
console.log(appInstance.globalData) // I am global data

注意：
App() 必须在 app.js 中注册，且不能注册多个。
不要在定义于 App() 内的函数中调用 getApp() ，使用 this 就可以拿到 app 实例。
不要在 onLaunch 的时候调用 getCurrentPage()，此时 page 还没有生成。
通过 getApp() 获取实例之后，不要私自调用生命周期函数。

页面注册

Page 

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

object 参数说明： 



示例代码：

// pages/index/main.js

var app = getApp();

Page({
data: {

getData: app.data

},
onLoad: function (options) {
// 页面初始化 options为页面跳转所带来的参数
},
onReady: function () {
// 页面渲染完成
},
onShow: function () {
// 页面显示
},
onHide: function () {
// 页面隐藏
},
onUnload: function () {
// 页面关闭
},
onPullDownRefresh:function(){
//下拉操作

},
onReachBottom: function() {
//上拉操作
},
onShareAppMessage: function () {
// 右上角分享.
}

})

初始化数据 

初始化数据将作为页面的第一次渲染。data 将会以 JSON 的形式由逻辑层传至渲染层，所以其数据必须是可以转成 JSON 的格式：字符串，数字，布尔值，对象，数组。

渲染层可以通过 WXML 对数据进行绑定。

示例代码：

<view>{{text}}</view>
<view>{{array[0].msg}}</view>

Page({
data: {
text: 'init data',
array: [{msg: '1'}, {msg: '2'}]
}
})

接下来看看Page的周期函数，Page总共有五个生命周期函数：

1.onLoad: 页面加载
一个页面只会调用一次。
接收页面参数可以获取wx.navigateTo和wx.redirectTo及中的 query。

2.onShow: 页面显示
每次打开页面都会调用一次。

3.onReady: 页面初次渲染完成
一个页面只会调用一次，代表页面已经准备妥当，可以和视图层进行交互。
对界面的设置如wx.setNavigationBarTitle请在onReady之后设置。

4.onHide: 页面隐藏
当navigateTo或底部tab切换时调用。

5.onUnload: 页面卸载
当redirectTo或navigateBack的时候调用。

可参考下图： 



页面的路由

在小程序中所有页面的路由全部由框架进行管理，对于路由的触发方式以及页面生命周期函数如下： 



Tab 切换对应的生命周期（以 A、B 页面为 Tabbar 页面，C 是从 A 页面打开的页面，D 页面是从 C 页面打开的页面为例）： 



页面栈 

框架以栈的形式维护了当前的所有页面。 当发生路由切换的时候，页面栈的表现如下： 



getCurrentPages() 

getCurrentPages() 函数用于获取当前页面栈的实例，以数组形式按栈的顺序给出，第一个元素为首页，最后一个元素为当前页面。

注意：不要尝试修改页面栈，会导致路由以及页面状态错误。