微信小程序的页面生命周期 以及onShow的应用场景

问题:

微信小程序,有一个tabbar底部菜单页面是 pages/orders/orders 这个页面点击后跳转后到 pages/details/details中。当我点击返回按钮到 orders后,可以触发哪个生命周期?

页面生命周期:

Page({

// 1. 页面加载时执行(只执行一次)

onLoad(options) {

console.log('页面加载', options)

// 用途:接收页面参数、初始化页面数据

// 示例:this.setData({ id: options.id })

},

// 2. 页面显示时执行(每次打开页面都会执行)

onShow() {

console.log('页面显示')

// 用途:刷新数据、开始动画等

// 示例:this.getLatestData()

},

// 3. 页面初次渲染完成时执行(只执行一次)

onReady() {

console.log('页面初次渲染完成')

// 用途:操作DOM、开始复杂动画等

},

// 4. 页面隐藏时执行

onHide() {

console.log('页面隐藏')

// 用途:暂停视频、停止动画等

},

// 5. 页面卸载时执行

onUnload() {

console.log('页面卸载')

// 用途:清理定时器、取消请求等

},

// 6. 下拉刷新

onPullDownRefresh() {

console.log('下拉刷新')

// 用途:刷新页面数据

// 注意:需要手动停止 wx.stopPullDownRefresh()

},

// 7. 上拉触底

onReachBottom() {

console.log('上拉触底')

// 用途:加载更多数据

},

// 8. 页面滚动

onPageScroll(e) {

console.log('页面滚动', e.scrollTop)

// 用途:隐藏/显示导航栏等

},

// 9. 分享功能

onShareAppMessage() {

return {

title: '分享标题',

path: '/pages/index/index'

}

}

})

当你从 pages/details/details 页面点击返回按钮回到 pages/orders/orders 这个 tabBar 页面时,orders 页面的 onShow 生命周期函数会被触发,而 onLoadonReady 不会再次执行

相关推荐
icebreaker20 小时前
Weapp-vite:原生模式之外,多一种 Vue SFC 选择
前端·vue.js·微信小程序
icebreaker20 小时前
重走 Vue 长征路 Weapp-vite:编译链路与 Wevu 运行时原理拆解
前端·vue.js·微信小程序
大米饭消灭者4 天前
Taro是怎么实现一码多端的【底层原理】
微信小程序·taro
FliPPeDround5 天前
Vitest Environment UniApp:让 uni-app E2E 测试变得前所未有的简单
微信小程序·e2e·前端工程化
FliPPeDround5 天前
微信小程序自动化的 AI 新时代:wechat-devtools-mcp 智能方案
微信小程序·ai编程·mcp
吴声子夜歌5 天前
小程序——布局示例
小程序
码云数智-大飞5 天前
如何创建自己的小程序,码云数智与有赞平台对比
微信小程序
luffy54595 天前
微信小程序页面使用类似filter函数的wxs语法
微信小程序·小程序
Slow菜鸟5 天前
微信小程序开发(二)目录结构完全指南
微信小程序·小程序
攀登的牵牛花5 天前
给女朋友写了个轻断食小程序:去老丈人家也是先动筷了
前端·微信小程序