1.当网络较慢,网页还在加载 Vue.js ,而导致 Vue 来不及渲染,这时页面就会显示出 Vue 源代码。我们可以使用 v-cloak 指令来解决这一问题。

<style>
[v-cloak]{
    display: none;
}
</style>

<div id="app"  v-cloak>
    {{context}}
</div>


<script>
    var app = new Vue({
        el: '#app',
        data: {
            context:'Use Vue!!!'
        }
    });
</script>

2. 如果有时添加完毕后仍有部分变量会显示  可能是 v-cloak 的display属性被优先级别高的样式覆盖所导致, 可尝试给[-vcloak]添加 !important

<style>
[v-cloak]{
    display: none!important;
}
</style>

 

posted on 2020-10-19 15:02  JioNote  阅读(161)  评论(0编辑  收藏  举报