vue3模板html中,会有一个有id的div来作为vue单页面应用的容器,在这个容器里面写一些html,在启动的时候显示,等到vue加载时,会清空此容器并且把单页面内容放到该容器中,因此可以利用这种方式来设置启动动画,若依vue3中的示例如下:
<body>
<div id="app">
<!-- 容器内写一个全屏的loading -->
<div id="loader-wrapper">
<div id="loader"></div>
<div class="loader-section section-left"></div>
<div class="loader-section section-right"></div>
<div class="load_title">正在加载系统资源,请耐心等待</div>
</div>
</div>
<script type="module" src="/src/pageone/main.js"></script>
</body>