• 首页
  • css3教程
  • html5教程
  • jQuery手册
  • vue手册
  • php手册
  • MySQL手册
  • apache手册
  • redis手册
  • v-cloak

    • 不需要表达式
    • 用法:这个指令保持在元素上直到关联组件实例结束编译。和 CSS 规则如[v-cloak]{display: none}一起用时,这个指令可以隐藏未编译的 Mustache 标签直到组件实例准备完毕。


    //CSS
    [v-cloak] {
       display: none;
    }
    
    //html
    <div v-cloak>
    	{{ message }}
    </div>
    

    <div>不会显示,直到编译结束。

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

    <div id="app">
      {{context}}
    </div>
    js:
    
    <script>
      var app = new Vue({
        el: '#app',
        data: {
          context:'互联网头部玩家钟爱的健身项目'
        }
      });
    </script>
    

    上篇:v-text

    下篇:v-slot