2021-02-23 09:05发布
打开微信开发者工具,在项目pages下,新建mypage文件夹,在文件夹内新建
page,名为mypage,并将mypage设为第一页面。
在项目的app.js中,在onLanuch方法中打印信息
console.log('app.onlaunch')
添加onShow和onHide方法,代码如下:
onShow:function(){
console.log('app.show')
},
onHide:function(){
console.log('app.hide')
编译运行小程序,然后点击切后台,再点击切前台,控制台打印信息如下图,依次调用的方法是onLanuch,onShow,onHide,onShow,这是全局的生命周期方法
在mypage.js中也有页面的生命周期方法,在onLoad、onReady、onShow、
onHide分别添加代码如下:
/**
* 生命周期函数--监听页面加载
*/
onLoad: function (options) {
console.log('mypage.onload')
* 生命周期函数--监听页面初次渲染完成
onReady: function () {
console.log('mypage.onready')
* 生命周期函数--监听页面显示
onShow: function () {
console.log('mypage.onshow')
* 生命周期函数--监听页面隐藏
onHide: function () {
console.log('mypage.onhide')
* 生命周期函数--监听页面卸载
onUnload: function () {
console.log('mypage.onunload')
编译运行代码,观察打印出信息如下图,这就是小程序正常启动,显示第一页面的顺序
为mypage增加跳转页面按钮,在mypage.wxml修改代码如下:
第一个按钮会跳转到logs页面同时触发mypage的onhide方法,第一个按钮会跳转到logs页面同时触发mypage的onunload方法
在mypage.js中,添加上面按钮的事件方法,代码如下:
clickHandler1:function(){
wx.navigateTo({
url: '../logs/logs',
})
clickHandler2: function () {
wx.redirectTo({
编译运行代码,依次点击模拟器的上下两个button,控制台打印信息如下图。这也是navigateTo和redirectTo跳转方法的区别,页面onunload之后就无法再返回到原页面了
最多设置5个标签!
打开微信开发者工具,在项目pages下,新建mypage文件夹,在文件夹内新建
page,名为mypage,并将mypage设为第一页面。
在项目的app.js中,在onLanuch方法中打印信息
console.log('app.onlaunch')
添加onShow和onHide方法,代码如下:
onShow:function(){
console.log('app.show')
},
onHide:function(){
console.log('app.hide')
},
编译运行小程序,然后点击切后台,再点击切前台,控制台打印信息如下图,依次调用的方法是onLanuch,onShow,onHide,onShow,这是全局的生命周期方法
在mypage.js中也有页面的生命周期方法,在onLoad、onReady、onShow、
onHide分别添加代码如下:
/**
* 生命周期函数--监听页面加载
*/
onLoad: function (options) {
console.log('mypage.onload')
},
/**
* 生命周期函数--监听页面初次渲染完成
*/
onReady: function () {
console.log('mypage.onready')
},
/**
* 生命周期函数--监听页面显示
*/
onShow: function () {
console.log('mypage.onshow')
},
/**
* 生命周期函数--监听页面隐藏
*/
onHide: function () {
console.log('mypage.onhide')
},
/**
* 生命周期函数--监听页面卸载
*/
onUnload: function () {
console.log('mypage.onunload')
},
编译运行代码,观察打印出信息如下图,这就是小程序正常启动,显示第一页面的顺序
为mypage增加跳转页面按钮,在mypage.wxml修改代码如下:
第一个按钮会跳转到logs页面同时触发mypage的onhide方法,第一个按钮会跳转到logs页面同时触发mypage的onunload方法
在mypage.js中,添加上面按钮的事件方法,代码如下:
clickHandler1:function(){
wx.navigateTo({
url: '../logs/logs',
})
},
clickHandler2: function () {
wx.redirectTo({
url: '../logs/logs',
})
},
编译运行代码,依次点击模拟器的上下两个button,控制台打印信息如下图。这也是navigateTo和redirectTo跳转方法的区别,页面onunload之后就无法再返回到原页面了
一周热门 更多>