Vue3 - 实现网页白屏加载期间自动插入 “自定义“ 加载 loading 动画,每当页面打开加载时就会自动显示动画或图片文件(全局注入网站首屏加载等待动画,利用动态图或动画解决长时间白屏的问题)

前言

如果您是 Vue2 项目接入此功能,请访问 这篇文章。

本文 实现了 vue3 网站开发中,当页面加载时显示自定义的加载动画(解决页面加载白屏问题),全局注入简单快捷,

您可以自定义任何白屏加载时的动画 CSS 或图片等,每当网页加载时就会显示 loading 加载动画。


如下图所示,我将浏览器网络调成了 3G,当网页处于加载时就会显示动画,

本文提供了很多种加载动画,您根据需求选择或直接自己自定义。

无论您 vue3 项目用的是 vite 还是 webpack 工具都可以!无任何框架和插件依赖!

在这里插入图片描述

实现代码

猜你喜欢

转载自blog.csdn.net/weixin_44198965/article/details/132845279