重新加载页面时 CSS 在 vuejs 中中断

【问题标题】：CSS is breaking in vuejs on reload of page重新加载页面时 CSS 在 vuejs 中中断
【发布时间】：2023-02-05 19:20:11
【问题描述】：

当我重新加载页面时，CSS 在 vuejs 中中断 enter image description here

我试图从我的 app.vue 更改 css 但没有任何反应它有同样的问题..

【问题讨论】：

【解决方案1】：

为避免这种情况，您可以使用v-cloak。该指令用于隐藏元素，直到 Vue 实例完成编译。这在处理由 Vue 实例生成的动态内容时很有用，我们希望避免在加载内容时页面出现任何闪烁或跳转。
检查official docs。

const app = Vue.createApp()

app.mount('#app')

#app[v-cloak] {
  display: none
}

section {
  width: 200px;
  height: 200px;
  background-color: lightcyan
}

<script src="https://unpkg.com/vue@3/dist/vue.global.js"></script>

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

【讨论】：