编程 Javascript

Vue SPA 初次进入加载动画实现代码

Posted in Javascript onNovember 14, 2019

在app挂载的div同级处写一个加载动画，例如：

<body class="font-hei">
  <div class="wrap" id="loader">
   <div>
    <div class="mult2rect mult2rect1"></div>
    <div class="mult2rect mult2rect2"></div>
    <div class="mult2rect mult2rect3"></div>
    <div class="mult2rect mult2rect4"></div>
    <div class="mult2rect mult2rect5"></div>
   </div>
  </div>
 <div id="app" style="min-height: 100vh"></div>

加载完成后，在App.vue的钩子函数内移除这个div。

created: function() {
  document.body.removeChild(document.getElementById('loader'));
}

以上这篇Vue SPA 初次进入加载动画实现代码就是小编分享给大家的全部内容了，希望能给大家一个参考，也希望大家多多支持三水点靠木。

Vue SPA 初次进入加载动画实现代码

- Author -

川大宝啊

声明：登载此文出于传递更多信息之目的，并不意味着赞同其观点或证实其描述。

Javascript 相关文章推荐

JavaScript 未结束的字符串常量常见解决方法

Jan 24 Javascript

escape编码与unescape解码汉字出现乱码的解决方法

Jul 02 Javascript

JavaScript中的Promise使用详解

Jun 24 Javascript

jQuery插件FusionCharts绘制的3D饼状图效果实例【附demo源码下载】

Mar 03 Javascript

Angular.js实现动态加载组件详解

May 28 Javascript

解决vue页面刷新或者后退参数丢失的问题

Mar 13 Javascript

Koa代理Http请求的示例代码

Oct 10 Javascript

谈谈为什么你的 JavaScript 代码如此冗长

Jan 30 Javascript

微信小程序实现Session功能及无法获取session问题的解决方法

May 07 Javascript

vue使用prop可以渲染但是打印台报错的解决方式

Nov 13 Javascript

js实现直播点击飘心效果

Aug 19 Javascript

js+audio实现音乐播放器

Sep 13 Javascript

构建大型 Vue.js 项目的10条建议(小结)

Nov 14 #Javascript

vue实现修改图片后实时更新

Nov 14 #Javascript

Vue中img的src是动态渲染时不显示的解决

Nov 14 #Javascript

JQuery发送ajax请求时中文乱码问题解决

Nov 14 #jQuery

vue-cli3.X快速创建项目的方法步骤

Nov 14 #Javascript

vue.config.js常用配置详解

Nov 14 #Javascript

解决vue项目中页面调用数据在数据加载完毕之前出现undefined问题

Nov 14 #Javascript

You might like

神族 PROTOSS 概述

2020/03/14 星际争霸

php getimagesize 上传图片的长度和宽度检测代码

2010/05/15 PHP

免费的ip数据库淘宝IP地址库简介和PHP调用实例

2014/04/08 PHP

Javascript 个人笔记（没有整理，很乱）

2007/07/07 Javascript

jQuery 使用个人心得

2009/02/26 Javascript

修改好的jquery滚动字幕效果实现代码

2011/06/22 Javascript

jQuery+css+html实现页面遮罩弹出框

2013/03/21 Javascript

javascript实现获取服务器时间

2015/05/19 Javascript

jQuery实现表单步骤流程导航代码分享

2015/08/28 Javascript

jQuery实现页面下拉100像素出现悬浮窗口的方法

2016/09/05 Javascript

Vue.js实现文章评论和回复评论功能

2020/05/30 Javascript

Vue二次封装axios为插件使用详解

2018/05/21 Javascript

vue自定v-model实现表单数据双向绑定问题

2018/09/03 Javascript

[02:51]2014DOTA2 TI小组赛总结中国军团全部进军钥匙球馆

2014/07/15 DOTA

[55:42]VG vs VGJ.T 2018国际邀请赛淘汰赛BO1 8.21

2018/08/22 DOTA

Python中itertools模块用法详解

2014/09/25 Python

Python中的异常处理学习笔记

2015/01/28 Python

Python内置函数dir详解

2015/04/14 Python

Python中DJANGO简单测试实例

2015/05/11 Python

Python+MongoDB自增键值的简单实现

2016/11/04 Python

python multiprocessing多进程变量共享与加锁的实现

2019/10/02 Python

简单了解Python write writelines区别

2020/02/27 Python

python 中的paramiko模块简介及安装过程

2020/02/29 Python

python+opencv实现移动侦测（帧差法）

2020/03/20 Python

Django中文件上传和文件访问微项目的方法

2020/04/27 Python

Python 使用xlwt模块将多行多列数据循环写入excel文档的操作

2020/11/10 Python

python二维图制作的实例代码

2020/12/03 Python

使用css3背景渐变中的透明度来设置不同颜色的背景渐变

2014/03/31 HTML / CSS

CSS3 不定高宽垂直水平居中的几种方式

2020/03/26 HTML / CSS

Java面试题：说出如下代码的执行结果

2015/10/30 面试题

大学生的网上创业计划书

2013/12/31 职场文书

手术室护士长竞聘书

2014/03/31 职场文书

二年级小学生评语

2014/04/21 职场文书

大队委员竞选演讲稿

2015/11/20 职场文书

银行服务理念口号

2015/12/25 职场文书

公历12个月名称的由来

2022/04/12 杂记