electron Tab加载动画开启和关闭

 记个开发中的bug,以此为鉴。眼懒得时候手勤快点儿,不要想当然!!!

没有转载的价值,请勿转载搬运呦。

WebContents API:

Event: 'did-finish-load'​

导航完成时触发,即选项卡的旋转器将停止旋转,并指派onload事件后。

Event: 'did-stop-loading'​

当tab中的旋转指针(spinner)结束旋转时,就会触发该事件。

复现步骤:

  1. 使用账号登录客户端系统。
  2. 点击菜单栏菜单,跳转其他系统页面正常,在此页面点击打开任意链接,一直停留在加载动画页面

截图:

原因分析:

页面打开时,loading加载动画及时关闭(did-finish-load),在本页面跳转时,loading动画没有及时关闭(did-finish-load生命周期没有执行到)

根据此情况又增加了几个生命周期,代码执行情况如下:

this.browserViewList[`${arg.applicationKey}`].webContents.on('did-start-loading',() => {_this.browserViewList[`${arg.applicationKey}`].webContents.send('loading-show')log.info('did-start-loading')})//did-stop-loadingthis.browserViewList[`${arg.applicationKey}`].webContents.on('did-stop-loading',() =>_this.browserViewList[`${arg.applicationKey}`].webContents.send('loading-hide'))//dom-readythis.browserViewList[`${arg.applicationKey}`].webContents.on('dom-ready',() => log.info('dom-ready'))//did-frame-finish-loadthis.browserViewList[`${arg.applicationKey}`].webContents.on('did-frame-finish-load',() => log.info('did-frame-finish-load'))//did-finish-load监听加载完成---隐藏loading====>此事件新打开页面会执行,在打开页面链接跳转时不会执行this.browserViewList[`${arg.applicationKey}`].webContents.on('did-finish-load',() => log.info('did-finish-load'))

跳转1.0系统打开页面执行的生命周期

在1.0系统跳转链接执行生命周期

解决方案:

修改动画关闭的生命周期为did-stop-loading

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.mzph.cn/news/690768.shtml

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

conda 进入python环境里pip install安装不到该环境或不生效

参考:https://blog.csdn.net/weixin_47834823/article/details/128951963 https://blog.51cto.com/u_15060549/4662570?loginfrom_csdn 1、直接进入python Scripts目录下安装 cmd打开运行窗口,cd切换路径至指定虚拟环境下的Scripts路径后再pip安装 擦…

Asp.Net web 文件服務快速搭建

簡述 內容具體分為兩種分為上傳和下載部分,服務搭載仍然選擇IIS,內容還是相對簡單,只是內部使用,沒有使用太多的優化的技巧,net環境為4.7 上傳服務 上傳需要注意的是,HttpPostedFileBase 不支持大文件傳輸&#xff0…

文件上传漏洞--Upload-labs--Pass10--双写绕过

一、什么是双写绕过 顾名思义,双写绕过就是双写文件后缀名来进行绕过,如:test.php 双写后为 test.pphphp。通常情况下双写绕过用于绕过源代码中的 str_ireplace()函数。 二、双写绕过原理 1、首先进行代码审计,源代码中有黑名单…

ADO.NET大数据查询内存分页处理

ADO.NET大数据查询内存分页处理 在ADO.NET中处理大数据查询时,如果直接在客户端应用程序中进行内存分页,可能会导致内存使用量激增,特别是在处理数十万甚至数百万条记录时。为了避免这种情况,应该优先使用数据库层面的分页&#x…

Java 的 8 种异步实现方式

异步执行对于开发者来说并不陌生,在实际的开发过程中,很多场景多会使用到异步,相比同步执行,异步可以大大缩短请求链路耗时时间,比如:发送短信、邮件、异步更新等,这些都是典型的可以通过异步实…

NBlog个人博客部署维护过程记录 -- 后端springboot + 前端vue

项目是fork的Naccl大佬NBlog项目,页面做的相当漂亮,所以选择了这个。可以参考2.3的效果图 惭愧,工作两年了也没个自己的博客系统,趁着过年时间,开始搭建一下. NBlog原项目的github链接:Naccl/NBlog: &#…

数据库||数据库的完整性

1.实验题目:数据库的完整性 2.实验目的和要求: 掌握数据库的实体完整性约束定义,完整性检查及违约处理方式。 掌握数据库的参照完整性约束定义,完整性检查及违约处理方式。 掌握数据库的用户定义完整性约束定义,完…

如何构建企业专属GPT

大语言模型(LLM)具有令人印象深刻的自然语言理解和生成能力, 2022年11月底OpenAI发布了ChatGPT,一跃成为人工智能AI领域的现象级应用。但由于LLM的训练数据集主要来源于互联网数据,企业私域信息并未被LLM所训练&#x…

LeetCode 3028.边界上的蚂蚁

边界上有一只蚂蚁&#xff0c;它有时向 左 走&#xff0c;有时向 右 走。 给你一个 非零 整数数组 nums 。蚂蚁会按顺序读取 nums 中的元素&#xff0c;从第一个元素开始直到结束。每一步&#xff0c;蚂蚁会根据当前元素的值移动&#xff1a; 如果 nums[i] < 0 &#xff0…

如何从 git 分支中合并特定文件,而不是整个分支的内容

问题 在git 中&#xff0c;我们可以使用 git merge 命令&#xff0c;合并整个分支&#xff0c;覆盖当前分支的内容&#xff0c;但是有时候我们并不想这么做&#xff0c;而是想 merge 某个文件。那么下面提供两种办法。 方法一 使用 git checkout&#xff0c;从别的分支&…

MySQL进阶 - 备份与恢复

我是南城余&#xff01;阿里云开发者平台专家博士证书获得者&#xff01; 欢迎关注我的博客&#xff01;一同成长&#xff01; 一名从事运维开发的worker&#xff0c;记录分享学习。 专注于AI&#xff0c;运维开发&#xff0c;windows Linux 系统领域的分享&#xff01; 知…

gowin GW1N4 OSC IP 使用

创建工程 1. File 选项下&#xff0c;选择新建工程New.. 2.Name 是指工程名&#xff1b;Creat in 指工程路径&#xff1b; 3.选择对应的 器件&#xff0c;本测试示例使用的是 GW1N4BLV_LQFP144C6I5; 4.选择好器件型号&#xff0c;单击Finish; 5.给工程增加VerilogFile 即 .v …

IDEA2023版本创建Spring项目只能勾选17和21却无法使用Java8

问题&#xff1a;新建springboot项目时&#xff0c;发现java版本只有17和21 解决办法&#xff1a;将server URL中的https://start.spring.io/更换成http://start.springboot.io/或者https://start.aliyun.com/ 截图如下&#xff1a; 原因分析 Spring官方发布Spring Boot 3.0.0…

【JVM篇】什么是运行时数据区

文章目录 &#x1f354;什么是运行时数据区⭐程序计数器⭐栈&#x1f50e;Java虚拟机栈&#x1f388;栈帧的内容 &#x1f50e;本地方法栈 ⭐堆⭐方法区 &#x1f354;什么是运行时数据区 运行时数据区指的是jvm所管理的内存区域&#xff0c;其中分为两大类 线程共享&#xf…

Nginx介绍和使用

Nginx是一个高性能的HTTP和反向代理web服务器&#xff0c;其使用方法包括安装、配置以及与其他软件的配合使用。 Nginx被广泛认为是一个轻量级、占用资源少、并发处理能力强大的web服务器软件。它不仅可以作为HTTP服务器提供静态内容服务&#xff0c;还可以作为反向代理服务器…

【小呆的力学笔记】弹塑性力学的初步认知四:简单应力状态下的应力应变关系

文章目录 2. 简单应力状态下的应力应变关系2.1 简单拉伸的应力应变关系2.2 真实应力应变关系2.3 应力-应变关系简化模型 2. 简单应力状态下的应力应变关系 我们在高中就学过&#xff0c;弹簧拉伸力和变形量成比例&#xff0c;对于一般的金属材料&#xff0c;在一定载荷以内这种…

leetcode刷题记录:二叉树02(思路篇)

参考labuladong的算法小抄&#xff1a;https://labuladong.online/algo/data-structure/binary-tree-part1/ 复习二叉树纲领篇&#xff0c;二叉树解题的思维模式分两类&#xff1a; 1、是否可以通过遍历一遍二叉树得到答案&#xff1f;如果可以&#xff0c;用一个 traverse 函…

Elasticsearch如何设置密码

目录 一、配置1.修改配置文件2.设置密码3.修改密码 二、验证 一、配置 1.修改配置文件 修改配置文件 config/elasticsearch.yml&#xff0c;写入以下配置&#xff1a; xpack.security.enabled: true discovery.type: single-node xpack.security.transport.ssl.enabled: tru…

【数据结构】二叉树根节点到特定节点路径(C语言版)

二叉树——根节点到特定节点路径查找 一、思路二、代码实现 一、思路 使用二叉链表创建的二叉树&#xff0c;这里我的思路是用链栈来存放找寻二叉树特定节点中&#xff0c;用来存放节点元素 个人思路&#xff1a;创建链栈&#xff0c;遍历二叉树并把路径中节点元素存放到栈中&…