六、 模板
1. 简介
Vue.js使用基于HTML的模板语法，可以将DOM绑定到Vue实例中的数据
模板就是{{}}，用来进行数据绑定，显示在页面中
也称为Mustache语法
2. 数据绑定的方式
a.双向绑定
v-model
b.单向绑定
方式1：使用两对大括号{{}}，可能会出现闪烁的问题，可以使用v-cloak解决
方式2：使用v-text、v-html
3. 其他指令
v-once 数据只绑定一次
v-pre 不编译，直接原样显示
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>模板</title>
<script src="js/vue.js"></script>
<script>
window.onload=function(){
let vm=new Vue({
el:'#itany',
data:{
msg:'welcome to itany'
},
created:function(){
// alert(111);
}
});
}
</script>
<style>
/* 必须配置css样式，否则不生效 */
[v-cloak]{
display:none;
}
</style>
</head>
<body>
<div id="itany">
<input type="text" v-model="msg">
<h3>aaa<span v-cloak>{{msg}}</span></h3>
<h3 v-text="msg"></h3>
<h3 v-html="msg"></h3>
<h3 v-once>{{msg}}</h3>
<h3 v-pre>{{msg}}</h3>
</div>
</body>
</html>
