当前位置: 首页 > news >正文

Vue之刷新页面会触发的生命周期函数

刷新页面时不会触发组件的 onUnmount 事件。

因为刷新页面会直接销毁整个页面的 DOM 树和内存中的组件实例,属于“强制清空”,而非组件正常从 DOM 树中卸载的流程。

而 onUnmount 的核心是“组件正常卸载(如路由切换、条件渲染移除)时执行”,仅在组件主动脱离 DOM 树的场景下触发。

 

刷新页面时触发 Vue 函数,核心是抓“页面刷新的生命周期节点”,常用 3 种场景化方案,直接适配不同需求:

1. 组件初始化时触发:若函数需在刷新后组件挂载完成执行,直接把函数写在 onMounted(Vue3)或 mounted(Vue2)中,刷新页面会重新执行组件挂载,进而触发函数。

2. 页面刷新前触发:若需在刷新前执行(如保存数据),用浏览器 beforeunload (unload是卸载的意思)事件,在 onMounted 中注册事件,刷新前会触发绑定的函数(注意:部分浏览器对弹窗等操作有限制)。

3. 页面刷新后(DOM 加载完成)触发:若需等页面所有资源加载完再执行,可在 onMounted 中注册浏览器 load 事件,确保刷新后页面资源就绪再触发函数。

 

http://www.zskr.cn/news/15351.html

相关文章:

  • 深入解析:App Store 上架完整流程解析,iOS 应用发布步骤、ipa 文件上传工具、TestFlight 测试与苹果审核经验
  • 傅里叶的一生
  • 实用指南:AI Agent开发平台如何设计?核心架构与工作流实战案例详解
  • 实用指南:OpenAI Sora 2重磅发布:AI视频生成进入“GPT-3.5时刻”
  • 题解:AT_agc038_f [AGC038F] Two Permutations
  • 详细介绍:Java基础
  • 20250929给PRO-RK3566开发板在Buildroot系统下裁剪内核【已关闭摄像头ov4689为例子】 - 指南
  • 解码红黑树
  • 为什么词嵌入可以和位置编码相加
  • 实用指南:软件设计师——04 操作系统
  • 多模态大语言模型OISA - 详解
  • 线段树合并 [POI 2011] ROT-Tree Rotations
  • ModuleNotFoundError: No module named wandb.keras
  • flink执行图 - 教程
  • 总结问题2 软工10.3
  • BPL包无法调试的问题
  • 最短路练习
  • 学习笔记:压位高精
  • 近期杂题
  • 并查集 D. Shark [Codeforces Round 484(Div. 2)]
  • Hackersdaddy ROUGE CTF 2025 完整解题记录
  • AI元人文系列:透明推理者——下一代大模型架构设计
  • 实用指南:【C语言】char * 、char [ ]、const char * 和 void *的使用以及区别
  • 实用指南:1、docker入门简介
  • 调试parlant的大模型配置,最终自己动手写了g4f的模块挂载 - 教程
  • unity面向组合开发二:EC的代码实践
  • airsim多无人机+无人车联合仿真辅导 - 教程
  • CSP-JF36
  • 【进入便捷的系统不解决问题】ubuntu开机出现‘系统出错且无法恢复。请联系系统管理员’
  • QOJ #8147. Math Exam 题解