编程 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 相关文章推荐

输入自动提示搜索提示功能的使用说明:sugggestion.txt

Sep 02 Javascript

js获取和设置属性的方法

Feb 20 Javascript

JavaScript的21条基本知识点

Mar 04 Javascript

js 左右悬浮对联广告代码示例

Dec 12 Javascript

jquery实现Li滚动时滚动条自动添加样式的方法

Aug 10 Javascript

JavaScript实现类似拉勾网的鼠标移入移出效果

Oct 27 Javascript

JS异步文件分片断点上传的实现思路

Dec 25 Javascript

React简单介绍

May 24 Javascript

javascript将json格式数组下载为excel表格的方法

Dec 22 Javascript

深入理解Vue router的部分高级用法

Aug 15 Javascript

工作中常用到的ES6语法

Sep 04 Javascript

用js限制网页只在微信浏览器中打开(或者只能手机端访问)

Dec 24 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

PHP在Web开发领域的优势

2006/10/09 PHP

深入理解PHP中的global

2014/08/19 PHP

PHP编写daemon process详解及实例代码

2016/09/30 PHP

浅谈laravel框架与thinkPHP框架的区别

2019/10/23 PHP

js 关键词高亮(根据ID/tag高亮关键字)案例介绍

2013/01/21 Javascript

js跨浏览器实现将字符串转化为xml对象的方法

2013/09/25 Javascript

关于JavaScript对象的动态选择及遍历对象

2014/03/10 Javascript

Javascript学习笔记之对象篇（一） : 对象的使用和属性

2014/06/24 Javascript

js实现瀑布流的三种方式比较

2020/06/28 Javascript

React Native之TextInput组件解析示例

2017/08/22 Javascript

通过jquery的ajax请求本地的json文件方法

2018/08/08 jQuery

JS中的防抖与节流及作用详解

2019/04/01 Javascript

SSM+layUI 根据登录信息显示不同的页面方法

2019/09/20 Javascript

JavaScript中的相等操作符使用详解

2019/12/21 Javascript

vue 查看dist文件里的结构(多种方式)

2020/01/17 Javascript

vue实现购物车加减

2020/05/30 Javascript

vue3.0生命周期的示例代码

2020/09/24 Javascript

详解Vue数据驱动原理

2020/11/17 Javascript

Python实现将绝对URL替换成相对URL的方法

2015/06/28 Python

python实现csv格式文件转为asc格式文件的方法

2018/03/23 Python

浅谈python的dataframe与series的创建方法

2018/11/12 Python

python 字符串常用函数详解

2019/09/11 Python

浅谈python中统计计数的几种方法和Counter详解

2019/11/07 Python

自学python用什么系统好

2020/06/23 Python

HTML5录音实践总结(Preact)

2020/05/07 HTML / CSS

接口可以包含哪些成员

2012/09/30 面试题

EJB实例的生命周期

2016/10/28 面试题

2014信息公开实施方案

2014/02/22 职场文书

法律六进活动方案

2014/03/13 职场文书

五四青年节优秀演讲稿范文

2014/05/28 职场文书

机关党员公开承诺书

2014/08/30 职场文书

党员学习中共十八大报告思想汇报

2014/09/15 职场文书

失职检讨书大全

2015/01/26 职场文书

音乐教师个人总结

2015/02/06 职场文书

忆童年!用Python实现愤怒的小鸟游戏

2021/06/07 Python

Python进程间的通信之语法学习

2022/04/11 Python