【Uniapp-Vue3】onShow和onHide钩子的对比和执行顺序

页面生命周期函数的执行顺序是onLoad>onShow>onReady,其中只有onReady中才能获取到DOM节点。

一、onShow函数

每一次的页面切入都会触发onShow函数。

import {onShow} from "@dcloudio/uni-app";

onShow(()=>{...})

如果我点击"跳转页面1"再返回再点击"跳转页面1"再返回,那么一共会执行三次onshow

对比一下onLoad,同样的操作只触发了一次:

二、onHide函数

每一次的页面切出都会触发onHide函数,学习通后台检测切屏就使用的onHide函数。

import {onHide} from "@dcloudio/uni-app";

onHide(()=>{...})

如果我点击"跳转页面1"再返回再点击"跳转页面1"再返回,那么一共会执行两次onHide。

相关推荐
java水泥工5 分钟前
基于Echarts+HTML5可视化数据大屏展示-物流大数据展示
大数据·前端·echarts·html5·可视化大屏
U***e635 分钟前
Vue自然语言
前端·javascript·vue.js
用户7617363540120 分钟前
浏览器渲染原理
前端·浏览器
拉不动的猪20 分钟前
Vue 跨组件通信底层:provide/inject 原理与实战指南
前端·javascript·面试
得物技术20 分钟前
从数字到版面:得物数据产品里数字格式化的那些事
前端·数据结构·数据分析
用户66006766853932 分钟前
用 Symbol 解决多人协作中的对象属性冲突实战
前端·javascript
yinuo35 分钟前
前端跨页面通讯终极指南①:postMessage 用法全解析
前端
c***97981 小时前
Vue性能优化实战
前端·javascript·vue.js
哈哈O哈哈哈1 小时前
ECMAScript 2025 正式发布:10 个让你眼前一亮的 JavaScript 新特性!
前端·javascript
哈哈O哈哈哈1 小时前
2025 年值得关注的 CSS 新属性与功能
前端·css