Vue SPA 初次進(jìn)入加載動畫實現(xiàn)代碼
更新時間：2019年11月14日 09:48:30 作者：川大寶啊
今天小編就為大家分享一篇Vue SPA 初次進(jìn)入加載動畫實現(xiàn)代碼，具有很好的參考價值，希望對大家有所幫助。一起跟隨小編過來看看吧
在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的鉤子函數(shù)內(nèi)移除這個div。
created: function() {
document.body.removeChild(document.getElementById('loader'));
}
以上這篇Vue SPA 初次進(jìn)入加載動畫實現(xiàn)代碼就是小編分享給大家的全部內(nèi)容了，希望能給大家一個參考，也希望大家多多支持腳本之家。
相關(guān)文章
Vue.js每天必學(xué)之構(gòu)造器與生命周期，告訴大家什么是Vue.js構(gòu)造器與生命周期，感興趣的小伙伴們可以參考一下2016-09-09
element-ui中實現(xiàn)tree子節(jié)點部分選中時父節(jié)點也選中
這篇文章主要介紹了element-ui中實現(xiàn)tree子節(jié)點部分選中時父節(jié)點也選中的方式，具有很好的參考價值，希望對大家有所幫助。如有錯誤或未考慮完全的地方，望不吝賜教2022-08-08
Axios是一個功能強大、易用性高的HTTP庫,適用于大多數(shù)的前端項目,它提供了豐富的功能和靈活的配置選項,可以滿足不同項目的需求,這篇文章主要介紹了vue中使用axios的作用,需要的朋友可以參考下2023-08-08
vue業(yè)務(wù)實例之組件遞歸及其應(yīng)用
目中出現(xiàn)多級菜單時,需要多層for循環(huán)時,但是當(dāng)菜單增加層級時,需要在頁面結(jié)構(gòu)中增加一層for循環(huán),這時我們可以使用組件遞歸的思想來實現(xiàn),下面這篇文章主要給大家介紹了關(guān)于vue業(yè)務(wù)實例之組件遞歸及其應(yīng)用的相關(guān)資料,需要的朋友可以參考下2022-05-05
vue2結(jié)合element-ui的gantt圖實現(xiàn)可拖拽甘特圖
因為工作中要用到甘特圖,所以我在網(wǎng)上搜索可以用的甘特圖,搜索了好多,但是網(wǎng)上搜到大多數(shù)都很雞肋,不能直接使用,下面這篇文章主要給大家介紹了關(guān)于vue2結(jié)合element-ui的gantt圖實現(xiàn)可拖拽甘特圖的相關(guān)資料,需要的朋友可以參考下2022-11-11
淺談angular4.0中路由傳遞參數(shù)、獲取參數(shù)最nice的寫法
下面小編就為大家分享一篇淺談angular4.0中路由傳遞參數(shù)、獲取參數(shù)最nice的寫法，具有很好的參考價值，希望對大家有所幫助。一起跟隨小編過來看看吧2018-03-03
關(guān)于vue使用ant design vue,打包后a-date-picker控件無法選擇日期的問題
這篇文章主要介紹了關(guān)于vite .env.test環(huán)境使用ant design vue,打包后a-date-picker控件無法選擇日期的問題,本文針對這個問題提供了解決方法,需要的朋友可以參考下2023-04-04
單項數(shù)據(jù)流和雙向數(shù)據(jù)綁定的概念，這兩種不是相互沖突的嗎？即然能用v-model雙向數(shù)據(jù)綁定，不應(yīng)該就是雙向數(shù)據(jù)流了嗎？本文就詳細(xì)的介紹一下2022-04-04
這篇文章主要介紹了解析vue路由異步組件和懶加載案例，小編覺得挺不錯的，現(xiàn)在分享給大家，也給大家做個參考。一起跟隨小編過來看看吧2018-06-06
vue中實現(xiàn)路由跳轉(zhuǎn)的三種方式超詳細(xì)教程
這篇文章主要介紹了vue中實現(xiàn)路由跳轉(zhuǎn)的三種方式超詳細(xì)教程，其中聲明式router-link實現(xiàn)跳轉(zhuǎn)最簡單的方法，可用組件router-link來替代a標(biāo)簽，每種方式給大家講解的非常詳細(xì)需要的朋友可以參考下2022-11-11