一、
v-cloak 解决插值表达式闪烁问题 ，只会替换自己字节占位符
v-text 默认没有闪烁问题，替换元素中原本内容
v-html 将内容里面的标签
代码语言：javascript复制 <style>
[v-cloak]{
display: none;
}
</style>
</head>
<body>
<div id="app">
<p v-cloak>**不被替换**{{ msg }}</p>
<h1 v-text="msg">***被替换*</h1>
<div v-html="msg2">被替换</div>
</div>
<script type="text/javascript" src="vue.js" ></script>
<script>
var vm = new Vue({
el : "#app",
data : {
msg : "123",
msg2 : "<h1>这是一个标签</h1>"
}
})
</script>
v-bind 要绑定的属性，写合法的表达式
代码语言：javascript复制 <input type="button" value="提交" title="mytitle" />
<input type="button" value="提交" v-bind:title="mytitle '123'" />
<input type="button" value="提交" :title="mytitle" /> v-on 事件绑定机制
代码语言：javascript复制<input type="button" value="按钮" v-on:click="show" />
<input type="button" value="按钮" v-on:mouseover="show" /> var vm = new Vue({
el : "#app",
data : {
msg : "123",
msg2 : "<h1>这是一个标签</h1>",
mytitle:"这是一个title"
},
methods:{
show:function () {
alert("hello");
}
}
})
</script>在VM实例中，如果想要获取data上的数据，或者想要掉哦用methods中的方法，必须通过this.数据属性名或者this.方法名来进行访问，这里的this，就是表示我们new出来的实例
Vue实例，会监听自己身上data中所有数据的改变，只要数据一发生变化，就会自动把最新的数据，从data上同步到页面中去；好处：程序员只需关心数据，不需要考虑如何重新渲染DOM页面。
v-bind 只能实习数据的单向绑定，从M自动绑定到V,无法实现数据的双向绑定
v-model
v-model指令，可以是实现表单元素和model中数据的双向数据绑定
注意 v-model 只能运用在表单元素中
input(radio, text , address, email ...)select checkbox textarea
代码语言：javascript复制<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title></title>
<script type="text/javascript" src="vue.min.js" ></script>
</head>
<body>
<div id="app">
<div v-text="msg"></div>
<input type="text" v-model="msg"/>
</div>
</body>
<script>
var vw = new Vue({
el:"#app",
data:{
msg:"v-model效果展示！"
}
});
</script>
</html>
