v-cloakv-textv-html的使用
（1）实例
<!DOCTYPEhtml>
<htmllang="en">
<head>
<metacharset="UTF-8">
<metaname="viewport"content="width=device-width,initial-scale=1.0">
<metahttp-equiv="X-UA-Compatible"content="ie=edge">
<title>vue-cloak.v-text.v-html</title>
<scriptsrc="../lib/vue.js"></script><!--导入vue.js-->
<style>
[v-cloak]{
display:none;
}/*设置v-cloak类中的display为none来解决插值表达式的闪烁问题*/
</style>
</head>
<body>
<divclass="app">
<h1v-cloak>++++{{msg}}-------</h1>
<!--使用插值表达式会有闪烁问题-->
<!--使用插值表达式可以在前后添加内容，而v-text会覆盖标签内的内容-->
<h4v-text="msg"></h4>
<!--使用v-text没有闪烁问题-->
<pv-html="msg2"></p>
<!--使用v-html可以将msg2内容当做html进行输入，同时也会覆盖标签内容-->
</div>
<script>
varvm=newVue({
el:'.app',
data:{
msg:'努力学习vue',
msg2:'<h2>helloworld</h2>'
}
})
</script>
</body>
</html>
（2）v-cloakv-textv-html和插值表达式的区别与特点
使用插值表达式会有闪烁问题
设置v-cloak类中的display为none来解决闪烁问题
使用插值表达式可以在前后添加内容，v-text会覆盖标签内容
使用v-text没有闪烁问题
使用v-html来添加带有html标签的内容，同时也会覆盖原标签的内容
如需转载，请注明文章出处和来源网址：http://www.divcss5.com/html/h56725.shtml
