Vue---插值表达式{{}}、v-text、v-html用法

1、v-cloak: 标签属性能够解决插值表达式闪烁的问题，在style标签内设置[v-cloak]{display:none;}

<p v-cloak>{{msg}}</p>
<!-- 样式 -->
<style>
[v-cloak]{ display: none;}
</style>

2、插值表达式{{ 值 }}：在html标签中使用插值表达式{{ 值 }}，通过此方式可将data中的属性值以文本的形式显示在前端，插值表达式的前后都可以插入文本或者其他内容，在网页渲染时不会被覆盖，类似于占位符，同时它还有闪烁的问题需要配合v-cloak属性解决。

 <p v-cloak>我会在前端显示{{msg}}我会在前端显示</p>

3、v-text=" data中的属性"：v-text的作用和插值表达式的作用相似，都是用来显示data中的属性值，但是v-text与{{ 值 }} 不同的是，v-text会将之前在html标签中定义的文本覆盖掉。同时，v-text没有闪烁的问题。

<h4 v-text="msg">在前端渲染成功后我会消失</h4>

4、v-html：将data中的以html方式定义的文本，以html的方式显示在前端中，而不会显示html标签，v-html属性也会覆盖原先在html标签中定义的文本，v-html没有闪烁的问题。

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

msg: '<h1>世上无难事只怕有心人</h1>'