典型的app.js代码 结构如下:
//app.js代码
App({
onLaunch: function(){
//启动时执行的初始化工作(生命周期函数)
//全局只执行一次,不能在和这个方法中调用getCurrentPage()来获取当前页面的对象
//因为此时page还没生成
},
onShow: function(){
//小程序启动或从后台进入前台时,触发执行的操作(生命周期函数)
},
onHide: function(){
//小程序从前台进入后台时,触发执行的操作(生命周期函数)
},
onError: function(msg){
//小程序发生错误时的回调(生命周期函数)
console.log(msg)
},
globalConfl: {
indexDate:'',
matchDate:''
},
dataCache: {},
globalData: 'I am global data'
})
典型的一个页面page.js代码结构:
//page.js代码
Page({
data: {
//页面的初始数据(以json格式传给视图层,所以这里的数据必须能转成json格式)
text:'This is page data.'
},
onLoad: function(options){
//页面加载时执行的初始化工作(一次)
//参数可以获取wx.navigateTo和wx.redirectTo及<navigator/>中的query
},
onShow: function(){
//页面打开时,触发执行的操作(每次打开都会执行)
},
onReady: function(){
//页面初次渲染完成时执行(一次),此时可以和视图层进行交互
//对页面的设置(如wx.setNavigationBarTitle)请在onReady之后设置。
},
onHide: function(){
//页面隐藏时,触发执行的操作
//当navigateTo或底部进行tab切换时调用。
},
onUnLoad: function(){
//页面关闭(卸载)时触发执行的操作
//当redirectTo或navigateBack操作的时候调用。
},
onPullDownRefresh: function(){
//用户在页面下拉时执行的操作(要在window配置中开启enablePullDownRefresh)
//当处理完成数据刷新后,wx.stopPullDownRefresh可以停止当前页面的下拉刷新
},
onReachBotton: function(){
//页面上拉触底事件的处理函数
},
onShareAppMessage: function(){
//用户点击右上角分享时返回定制的分享数据
//只有定义了这个时间,右上角点击才会有转发按钮
//重点:需要return一个object,用于自定义分享内容
//字段:title:分享标题(默认小程序名称)
//path:分享路径(默认当前页面的path,必须是以/开头的完整路径)
},
//Event Handler 这些自定义的函数如果在page内调用可以直接使用this
viewTop: function(){
this.setData({
text:'set some data for updating view.'
})
},
})
一个完整的小程序执行的生命周期如下:
app.onLaunch->app.onShow->page1.onLoad->page1.onShow->page1.onReady
(打开程序,第一个页面page1加载完成)
->page1.onHide->page2.onLoad->page2.onShow->page2.onReady
(从第一个页面新打开page2)
->page2.onUnload->page1.onShow->...app.onUnload
(关闭page2,返回page1...退出小程序)
一个page的生命周期从onLoad事件开始,整个生命周期内onLoad、onReady、onUnload这三个事件仅执行一次,而onHide和onShow事件在每次页面隐藏和显示时都会触发。当用户手动触发左上角的退出箭头时,小程序仅触发app.onHide,下次进入小程序时会触发app.onShow以及当前page.onShow。
仅当小程序在后台运行超过一定事件未被唤起、或者用户手动在小程序的控制栏里点击退出程序、或者小程序内存占用过大被关闭时,小程序将被销毁,会触发app.onUnload事件。
小程序的线程架构:
每个小程序分为2个线程,view与appServer。其中view线程负责解析渲染页面(wxml和wxss文件),而appServer线程负责运行js。appServer线程运行在jsCore中(Android下运行在X5中,开发工具中运行在nwjs中)。