Admin.NET框架前端由于keep-alive设置缓存导致的onUnmount未触发问题

server/2024/11/23 11:49:52/

bug版本:next分支,基于.NET6版本;
问题描述:
1、添加keep-alive后,在其下运行的组件会出现onActived(被关注时)和onDeactived(取消关注时)生命周期,而组件原有生命周期为onMounted(被创造时)和onUnmounted(组件销毁时)。
2、若按照正常逻辑运行,打开一个tag的时候触发onMounted和onActived,当切换当前查看的tag时触发onDeactived,当关闭该tag时触发onDeactived和onUnmounted。
3、而实际测试发现,关闭tag时只触发了onDeactived,未触发onUnmounted。

bug影响:
1、onUnmounted未能被触发可能导致,若在前面的生命周期中使用了watch或其他时间监听设置,会无法被自动销毁,多次关闭打开同个tag后会有大量的监听重复建立,导致时间重复触发。
2、还可能导致web资源未能被回收,前面打开的tag只是被关闭,而没有被销毁,若不断重复打开tag和关闭tag可能会导致资源的负荷。

如下图所示,在每个生命周期添加一句打印,查看触发情况。而后打开一个开启了缓存功能的tag并关闭它,会发现并没有触发onUnmounted,而后若是重新打开和关闭该tag的操作,也只触发了onMounted、onActivated、onDeactivated,未触发onUnmounted。

onMounted(() => {console.log("onMounted");});onActivated(() => {console.log("onActivated");});onDeactivated(() => {console.log("onDeactivated");
});onUnmounted(() => {console.log("onUnmounted");
});

在这里插入图片描述

解决方案:
找到下图路径下的keepAliveNames文件,在删除缓存操作中添加延迟。而后测试,即可正常触发onUnmounted生命周期。
在这里插入图片描述
附一张keep-alive被设置位置的图做参考,下图无需要修改的内容:
在这里插入图片描述

注:该bug在Admin.net框架的最新版本中已被修复,具体导致的原因我也不太理解,可能是splice函数和keep-alive的include参数的工作原理存在冲突。
搜索半天也没找到类似的问题和解决方案,只有论坛https://segmentfault.com/q/1010000041002204,也提到了splice不触发keep-alive的问题,但是下面的回复全都文不对题,全都是讲新增了onActived、onDeactived两个生命周期,没有一个人理解楼主问的是组件被从include中使用splice移除后未被正常销毁的问题,让人看着恼火。


http://www.ppmy.cn/server/144249.html

相关文章

VSCode 间距太小

setting->font family 使用:Consolas, Courier New, monospace 字体

HTML·第八章 利用CSS制作导航栏菜单

8.1 水平顶部导航栏 水平顶部导航栏(Horizontal Top Navigation Bar)是网页设计中常用的一种导航栏布局,通常位于页面的顶部,以水平的方式排列导航选项。这种布局便于用户快速访问网站的主要部分。常见的设计元素包括菜单项、图标…

110. UE5 GAS RPG 实现玩家角色数据存档

在这篇,我们实现将玩家数据保存到存档内。 增加保存玩家属性 玩家属性默认的等级,经验值,可分配的技能点和属性点。还有一些角色基础属性也需要保存,回忆一下,我们是如何实现玩家的属性的,我们是通过多个…

金融量化框架选择

文章目录 1. **QuantConnect**2. **Zipline**3. **Backtrader**4. **QuantLib**5. **Alpaca**6. **PyAlgoTrade**7. **PyQuantLib**8. **QSTrader**如何选择开源量化交易框架?总结 在金融领域,很多开源量化交易框架和工具被广泛使用,允许研究…

Python学习29天

二分查找 # 定义函数冒泡排序法从大到小排列 def bbble_sort(list):# i控制排序次数for i in range(len(list) - 1):# j控制每次排序比较次数for j in range(len(list) - 1 - i):if list[j] < list[j 1]:list[j], list[j 1] list[j 1], list[j] # 定义二分查找函数 def…

鸿蒙动画开发08——帧动画

1、概 述 帧动画通过应用onFrame逐帧回调的方式&#xff0c;让开发者在应用侧的每一帧都可以设置属性值&#xff0c;从而实现设置了该属性值对应组件的动画效果。 相比于属性动画&#xff0c;开发者可感知动画的过程&#xff0c;实时修改UI侧的值&#xff0c;具有事件可实时响…

在 CentOS 7 上安装 MinIO 的步骤

在 CentOS 7 上安装 MinIO 的步骤 在 CentOS 7 上安装 MinIO 的步骤1. 更新系统2. 安装依赖3. 下载 MinIO4. 赋予执行权限5. 移动 MinIO 到系统路径6. 创建 MinIO 用户7. 创建数据目录8. 创建 MinIO 服务文件9. 启动 MinIO 服务10. 设置开机自启11. 访问 MinIO12. 配置防火墙&a…

Spire.PDF for .NET【页面设置】演示:打开 PDF 时自动显示书签或缩略图

用户打开 PDF 文档时&#xff0c;他们会看到 PDF 的初始视图。默认情况下&#xff0c;打开 PDF 时不会显示书签面板或缩略图面板。在本文中&#xff0c;我们将演示如何设置文档属性&#xff0c;以便每次启动文件时都会打开书签面板或缩略图面板。 Spire.PDF for .NET 是一款独…