v-cloak和v-text解决插入表达式闪烁问题，以及v-html用法

 <div id="app">
        <p>{{msg}}</p>
    </div>
    <script src="vue-2.5.17.js"></script>
    <script>
        var vm=new Vue({
            el:'#app',
            data:{
                msg:'123'
            }
        })
    </script>

这样写的时候可能会因为网速的问题，在网页上显示出短暂的  {{msg}}而不是123，所以为了解决这个问题，我们使用v-cloak

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

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

这样就不会出现上面的现象了

 

v-text

<p v-text="msg"></p>和<p>{{msg}}</p>是一样的，但是第二种不用v-cloak的话就会出现闪烁问题，而第一种是通过属性值设置的，所以不会有闪烁的问题

 

v-text和v-cloak的区别

v-text会把标签里面的东西全都覆盖，比如:

<p v-text="msg">i love you</p>

最后只会显示msg的内容，但是v-cloak不会

 

v-html

用于显示标签

<div v-html="msg2"></div>

var vm=new Vue({
            el:'#app',
            data:{
                msg:'123',
                msg2:"<h2>我是一个好学生</h2>"
            }
        })