插值的4种类型的语法格式
1 Mustache语法
mustache是胡须的意思，因为{undefined{}}像胡须，又叫大括号语法。
在vue对象挂载的dom元素中，{undefined{}}不仅可以直接写变量，还可以写简单表达式。
屈原为什么跳江{undefined{message}}
{undefined{message}},
<h2>{{firstName + lastName}}</h2>
<h2>{{firstName + " " + lastName}}</h2>
<h2>{{firstName}}{{lastName}}</h2>
<h2>{{count * 2}}</h2>
2 v-once v-once表示该dom元素只渲染一次，之后数据改变，不会再次渲染。
{undefined{message}}
{undefined{message}}
五一旅游 上述{{message}}的message修改后，第一个h2标签数据会自动改变，第二个h2不会。
3 v-html
介绍一个人 在某些时候我们不希望直接输出百度一下这样的字符串，而输出被html自己转化的超链接。此时可以使用v-html。
不使用v-html
{undefined{url}}
使用v-html，直接插入html
输出结果如下：元旦晚会主持词开场白
4 v-text
v-text会覆盖dom元素中的数据，相当于js的innerHTML方法。保险英语
长处英语{undefined{message}}，
使用v-text，以文本形式显示,会覆盖，
如图所示，使用{{message}}是拼接变量和字符串，而是用v-text是直接覆盖字符串内容。
有时候我们期望直接输出{undefined{message}}这样的字符串，而不是被{undefined{}}语法转化的message的变量值，此时我们可以使用v-pre标签。
不使用v-pre
地铁英语怎么说
{undefined{message}}
使用v-pre,不会解析
{undefined{message}}
6 v-cloak子虚乌有典故
有时候因为加载延时问题，例如卡掉了，数据没有及时刷新，就造成了页面显示从{undefined{message}}到message变量“你好啊”的变化，这样闪动的变化，会造成用户体验不好。此时需要使用到v-cloak的这个标签。在vue解析之前，div属性中有v-cloak这个标签，在vue解析完成之后，v-cloak标签被移除。简单，类似div开始有一个css属性display:none;，加载完成之后，css属性变成display:block，元素显示出来。
{undefined{message}}
这里通过延时1秒模拟加载卡住的状态，结果一开始不显示message的值，div元素中有v-cloak的属性，1秒后显示message变量的值，div中的v-cloak元素被移除。
