2.4 JS文件--小程序的逻辑
2.4.3 App注册
在app.js文件实现小程序的注册
App({
})
调用App函数，并传入一个对象作为参数
实际开发中，可以对这个参数对象添加一些属性，如生命周期回调函数、错误监听函数、全局变量等。
// app.js
App({
onLaunch() { //生命周期函数，小程序打开时执行一次
// 展示本地存储能力
const logs = wx.getStorageSync('logs') || []
logs.unshift(Date.now())
wx.setStorageSync('logs', logs)
// 登录
wx.login({
success: res => {
// 发送 res.code 到后台换取 openId, sessionKey, unionId
}
})
},
onShow(options){ //生命周期函数，小程序打开时和每次小程序切换到前台都会执行一次
},
onHide(){ //生命周期函数，每次小程序切换到后台都会执行一次
},
onError(msg){ //错误监听函数，每次小程序JS代码报错都会调用一次
},
globalData: { //全局变量
userInfo: null
}
})
在JavaScript中，函数本质也是一种对象，可以在Object中写成key-value的形式
// 通用格式
{
key: function 函数名（参数）{
}
}
// 样例
{
onLaunch: function onLaunchFunc(options) {
}
}
//简化 函数名称简化
{
key: function(参数) {
}
}
// 样例
{
onLaunch: function(options) {
}
}
//再简化 function关键词去掉
{
key(参数) {
}
}
// 样例
{
onLaunch(options) {
}
}
小程序的执行环境变化时，小程序就会自动调用定义好的函数去执行对应的语句，实现一些功能。
在App中，除了生命周期函数和错误监听函数以外，开发者还可以自定义一些全局变量或其他自定义函数，用this关键词可以访问这些自定义的函数和变量。
App({
tets: null, //自定义的全局变量test
muFunc(){
this.tests = 123 //通过this关键词可以访问到App中的变量
},
onLaunch() { //生命周期函数，小程序打开时执行一次
this.muFunc() //通过this关键词可以调用App的函数
})
2.4.4 Page注册
在App.js文件是小程序App的注册，在其他每个页面的JS文件是Page注册
Page({
/**
* 页面的初始数据
*/
data: {
text: 'This is page data.'//设置页面初始拥有一个变量text,其值为string类型
},
/**
* 生命周期函数--监听页面加载
*/
onLoad(options) {
},
/**
* 生命周期函数--监听页面初次渲染完成
*/
onReady() {
},
/**
* 生命周期函数--监听页面显示
*/
onShow() {
},
/**
* 生命周期函数--监听页面隐藏
*/
onHide() {
},
/**
* 生命周期函数--监听页面卸载
*/
onUnload() {
},
/**
* 页面相关事件处理函数--监听用户下拉动作
*/
onPullDownRefresh() {
},
/**
* 页面上拉触底事件的处理函数
*/
onReachBottom() {
},
/**
* 用户点击右上角分享
*/
onShareAppMessage() {
},
/**
* 页面滚动事件的处理函数
*/
onPageScroll(){},
/**
* 屏幕旋转事件的处理函数
*/
onResize(){},
onTabItemTap(item){ //如果在JSON中开启了tab页，单击页面中的tab会触发本函数
console.log(item.index) //在调试器Console中打印函数对象中的indexa属性
console.log(item.pagePath)
console.log(item.text)
}
})
page注册中有一个data属性。这个属性不是用户自定义的属性，而是小程序规定的属性，它是页面中初始数据，在page注册的函数中可以通过this.data.text访问到访问到data中的变量text。
网友评论