No more than code.
小程序基础页面配置以及生命周期
| 注册程序 App(Object)
App() 函数用来注册一个小程序。接受一个 Object 参数，其指定小程序的生命周期回调等。 App() 必须在 app.js 中调用，必须调用且只能调用一次。
- onLaunch：监听小程序初始化；小程序初始化完成时（全局只触发一次）
- onShow：监听小程序显示；小程序启动，或从后台进入前台显示时触发
- onHide：监听小程序隐藏；小程序从前台进入后台时触发
- onError：错误监听函数；小程序发生脚本错误，或者 api 调用失败时触发，会带上错误信息
- onPageNotFound：页面不存在监听函数
- 自定义：任意数据，用 this 访问；（全局变量）
前台、后台定义： 当用户点击左上角关闭，或者按了设备 Home 键离开微信，小程序并没有直接销毁，而是进入了后台；当再次进入微信或再次打开小程序，又会从后台进入前台。需要注意的是：只有当小程序进入后台一定时间，或者系统资源占用过高，才会被真正的销毁。
App({
onLaunch: function(options) {
// Do something initial when launch.
},
onShow: function(options) {
// Do something when show.
},
onHide: function() {
// Do something when hide.
},
onError: function(msg) {
console.log(msg)
},
globalData: 'I am global data'
})
getApp(Object) 全局的 getApp() 函数可以用来获取到小程序 App 实例。
Object 参数说明：
// other.js
var appInstance = getApp()
console.log(appInstance.globalData) // I am global data
注意：不要在定义于 App() 内的函数中调用 getApp() ，使用 this 就可以拿到 app 实例。
| 注册页面 Page(Object)
Page(Object) 函数用来注册一个页面。接受一个 Object 类型参数，其指定页面的初始数据、生命周期回调、事件处理函数等。
- data：页面的初始数据
- onLoad：生命周期回调—监听页面加载
- onShow：生命周期回调—监听页面显示
- onReady：生命周期回调—监听页面初次渲染完成
- onHide：生命周期回调—监听页面隐藏
- onUnload：生命周期回调—监听页面卸载
- onPullDownRefresh：监听用户下拉动作
- onReachBottom：页面上拉触底事件的处理函数
- onShareAppMessage：用户点击右上角转发
- onPageScroll：页面滚动触发事件的处理函数
- onTabItemTap：当前是 tab 页时，点击 tab 时触发
- 自定义：任意数据，在页面的函数中用 this 可以访问
//index.js
Page({
data: {
text: "This is page data."
},
onLoad: function(options) {
// 页面加载时触发，一个页面只会调用一次
// 可以在 onLoad 的参数中获取打开当前页面路径中的参数。
},
onReady: function() {
// -一个页面只会调用一次
// 代表页面已经准备妥当，可以和视图层进行交互。
},
onShow: function() {
// -页面显示/切入前台时触发
},
onHide: function() {
// 页面隐藏/切入后台时触发。 如 navigateTo 或底部 tab 切换到其他页面，小程序切入后台等。
},
onUnload: function() {
// 页面卸载时触发。如redirectTo或navigateBack到其他页面时。//////////////////////
},
onPullDownRefresh: function() {
// 需要在app.json的window选项中或页面配置中开启enablePullDownRefresh。
// 可通过wx.startPullDownRefresh触发下拉刷新，调用后触发下拉刷新动画，效果与用户手动下拉刷新一致。
// 当处理完数据刷新后，wx.stopPullDownRefresh可以停止当前页面的下拉刷新。
},
onReachBottom: function() {
// 可以在app.json的window选项中或页面配置中设置触发距离onReachBottomDistance。
// 在触发距离内滑动期间，本事件只会被触发一次。
},
onShareAppMessage: function (Object) {
// from 转发事件来源 button：页面内转发按钮； menu：右上角转发菜单
// target 如果 from 值是 button，则 target 是触发这次转发事件的 button，否则为 undefined
// webViewUrl 页面中包含<web-view>组件时， 返回当前<web-view>的url
// 此事件需要 return 一个 Object，用于自定义转发内容，返回内容：title/path/imageUrl
// if (res.from === 'button') {
// // 来自页面内转发按钮
// console.log(res.target)
// }
// return {
// title: '自定义转发标题',
// path: '/page/user?id=123'
// }
},
onPageScroll: function(Object) {
// scrollTop Number 页面在垂直方向已滚动的距离（单位px）
},
onTabItemTap(item) {
console.log(item.index)
console.log(item.pagePath)
console.log(item.text)
},
// Event handler.
viewTap: function() {
this.setData({
text: 'Set some data for updating view.'
}, function() {
// this is setData callback
})
},
customData: {
hi: 'MINA'
}
})
| 配置文件 app.json
{
// 页面文件的路径
"pages": [
"pages/index/index"
],
// 窗口表现
"window": {
"navigationBarTitleText": "Demo"
},
// 设置多 tab
"tabBar": {
"list": [{
"pagePath": "pages/index/index",
"text": "首页"
}, {
"pagePath": "pages/logs/logs",
"text": "日志"
}]
}
}
| 更多说明
-
开发环境下不校验合法域名： 微信开发者工具——详情——勾选”不校验合法域名、web-view（业务域名）、TLS 版本以及 HTTPS 证书”
-
获取转发信息：app.js onShow 中获取信息赋值给全局变量，页面中获取全局变量。前提是页面必须在 pages 目录下
