VueJS是否导致CSS动画再次加载?

我在Laravel中使用VueJS,并且当我包含VueJS时,加载Vue导致我的所有CSS动画(在页面加载时触发)再次播放时,页面似乎已重新解析/渲染。我已经检查过该页面实际上是否已加载一次(通过使用devise_for :users,:path_prefix => 'd',controllers: { sessions: 'sessions' } 检查重复项并查看HTTP请求,每个请求都调用一次)。

在查看性能跟踪时,您可以看到它何时发生,但是我不确定是什么原因或原因,或者从此处进行调试。

VueJS是否导致CSS动画再次加载?

请注意背景是动画的,但徽标不是;因此徽标保持可见状态,但动画会重新触发。

app.js(Vue入口)

console.log()

是什么原因导致包含Vue时重新加载动画?

更新:刚刚在另一个具有相同设置的网站上尝试过-div上的关键帧动画在使用Vue进行页面加载时动画两次,并且在没有Vue的情况下正确(应按一次)动画...

onlid 回答:VueJS是否导致CSS动画再次加载?

可能您的页面在没有 javascript 的情况下加载并启动动画,但是当您的 javascript 加载 Vuejs 时,会重新渲染 dom 的那部分。您可以将 v-cloak 添加到您的 #app div。

<div id="app" v-cloak> 
...
</div>

然后您可以将此 CSS 添加到您的 CSS 文件中。

[v-cloak] { 
 display: none; 
} 

通过这种方式,您的应用在 Vuejs 加载之前不会呈现。

https://vuejs.org/v2/api/#v-cloak

本文链接:https://www.f2er.com/3150836.html

大家都在问