使用 Vuetify 时，我无法防止内容初始闪现问题。我之前在使用没有任何 UI 库的 Vue 时使用通常的 v-cloak 解决方案实现了这一点，但无论出于何种原因，这不适用于 Vuetify，并且我仍然在 JS 之前获得无样式内容的闪烁。加载完毕。
我有初始的index.html，其中包含此内容(甚至尝试过内联display:none):
<head>
<style>
[v-cloak] {
display: none;
}
</style>
</head>
<body>
<div id="app" v-cloak style="display: none;"></div>
...
</body>
然后在初始的 app.vue 文件中:
<template>
<div id="app" v-cloak>
<v-app v-cloak>
...
<style>
[v-cloak] {
display: none;
}
出于某种原因，我认为 Vuetify 会覆盖内联 display: none 和多个 v-cloak。我应该如何解决此错误，以便用户在加载时不会出现初始闪烁？
最佳答案
这有点晚了，但问题似乎是页面在应用所有样式之前开始渲染。要解决这个问题，您只需mount您的 View 实例onload:
import App from './components/App.vue'
const vm = new Vue({
render: h => h(App)
})
window.onload = function() {
vm.$mount('#app');
}
关于css - Vuetify 忽略 v-cloak，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/48001190/