微信小程序：第四天
1.页面配置文件
主页面的配置文件中配置的选项是全局通用的，但是每个页面的需求不一样，所以，我们需要在页面文件夹下的.json文件中配置其页面的配置，如下面的代码示例：
{
"navigationBarTitleText": "查看启动日志"
}
于3.31日创建的示例代码文件。
2.逻辑层js文件
微信小程序分为逻辑层和视图层，逻辑层实现数据的加工和处理，最后将数据返回给视图层。
官方在JavaScript的基础上进行了一些封装和修改，主要有以下这些特点：
- 增加 App 和 Page 方法，进行程序和页面的注册。
- 增加 getApp 和 getCurrentPages 方法，分别用来获取 App 实例和当前页面栈。
- 提供丰富的 API，如微信用户数据，扫一扫，支付等微信特有能力。
- 每个页面有独立的作用域，并提供模块化能力。
- 由于框架并非运行在浏览器中，所以 JavaScript 在 web 中一些能力都无法使用，如 document，window 等。
- 开发者写的所有代码最终将会打包成一份 JavaScript，并在小程序启动的时候运行，直到小程序销毁。类似 ServiceWorker，所以逻辑层也称之为 App Service。
3.用app函数注册小程序
微信小程序提供了一个注册app的函数，每个小程序必须在app.js中进行注册，并且注册一次，因此，主要逻辑文件app.js必须包含注册方法。
注册函数有6个生命周期：
- onLaunch 生命周期函数--监听小程序初始化 当小程序初始化完成时，会触发 onLaunch（全局只触发一次）
- onShow 生命周期函数--监听小程序显示 当小程序启动，或从后台进入前台显示，会触发 onShow
- onHide 生命周期函数--监听小程序隐藏 当小程序从前台进入后台，会触发 onHide
- onError 错误监听函数 当小程序发生脚本错误，或者 api 调用失败时，会触发 onError 并带上错误信息
- 其他 开发者可以添加任意的函数或数据到 Object 参数中，用 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'
})
4.用page函数注册页面
微信小程序中每个页面必须使用page()函数进行注册。
创建的示例文件代码如下：
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
})
})
}
})
初始化的数据位于data中，其生命周期有：
-
onLoad: 页面加载
- 一个页面只会调用一次，可以在 onLoad 中获取打开当前页面所调用的 query 参数。
-
onShow: 页面显示
- 每次打开页面都会调用一次。
-
onReady: 页面初次渲染完成
- 一个页面只会调用一次，代表页面已经准备妥当，可以和视图层进行交互。
- 对界面的设置如wx.setNavigationBarTitle请在onReady之后设置。详见生命周期
-
onHide: 页面隐藏
- 当navigateTo或底部tab切换时调用。
-
onUnload: 页面卸载
- 当redirectTo或navigateBack的时候调用。
今天主要了解了app函数和page函数，需要进行熟悉和了解，明白器生命周期。