消除Vuetify中未样式化内容的闪烁

Question

在以下页面上（例如）单击任何CodePen链接：https://vuetifyjs.com/en/components/navigation-drawers

注意闪烁未样式化的内容。您如何消除这种情况？

当我进行硬刷新时，我在项目中看到了它。我尝试了v-cloak，但当然没有用。

Answer 1

您需要先隐藏应用

<div id="app" hidden>...</div>

然后在准备就绪后使用mounted.nextTick取消隐藏应用

  new Vue({
    el:'#app',
    mounted:function(){this.$nextTick(function(){
      this.$el.removeAttribute('hidden')
    })}
  });