vue.js学习之路—01v-cloak、v-text、v-html、插值表达式、vue中MVVM模型所对应
1.vue中MVVM模型所对应
2.插值表达式
3.指令v-cloak、v-text、v-html
代码如下：
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title></title>
<script src="../js/vue.js" type="text/javascript" charset="utf-8"></script>
</head>
<body>
<div id="test"><!--MVVM中的V：Vue实例控制的区域(View，视图)-->
<!--v-cloak:能解决插值表达式闪烁的问题-->
<span v-cloak>
+++++++{{msg}}++++++++
</span>
<!--默认v-text是没有闪烁问题的，但是会覆盖标签的内容，而插值表达式只会替换占位符的内容如{{msg}}-->
<h3 v-text="msg">===============</h3>
<!--
v-html:会按html语法执行，生成一个h1标题
-->
<div>{{msg2}}</div>
<div v-text="msg2"></div>
<div v-html="msg2"></div>
</div>
<script type="text/javascript">
/**
* MVVM关系
*/
var vm = new Vue({/*new出来的实例是MVVM中的VM调度者*/
el:"#test",
data:{/*MVVM模型中的M：用来保存每个页面的数据(Model，数据模型)*/
msg:"欢迎学习vue",
msg2:"<h1>这是标题</h1>"
}
});
</script>
</body>
</html>
运行结果：