vue指令：
v-cloak：插值表达式，隐藏值未载入时显示的标签
<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>无标题文档</title>
<style>
[v-cloak]{display:none;}
</style>
</head>
<body>
<div id="app">
<p v-cloak>{{ msg }}</p>
</div>
<script src="vue.min.js"></script><!--注：此引入必须和下面代码块放在一块，否则看不到v-cloak效果-->
<script>
var vm = new Vue({
el:'#app',
data:{
msg:'456'
}
});
</script>
</body>
</html>
v-text：显示文本内容
v-html：显示html内容
v-bind：用于绑定属性的指令
<input type="button" v-bind:title="mytitle + '123'">#还可以连接字符串 或者省略v-bin <input type="button" :title="mytitle"> 有两种写法
v-on的缩写和事件修饰符
stop：阻止事件冒泡
prevent：阻止默认事件
.capture：添加事件侦听器时使用事件捕获模式
.self：只在元素本身触发事件时触发
.once：事件只触发一次
<!doctype html> <html> <head> <meta charset="utf-8"> <title>无标题文档</title> <style> [v-cloak]{display:none;} .dv1 {background: #BDC9D4; padding: 10px;} </style> </head> <body> <div id="app"> <p v-cloak>{{ msg }}</p> <div v-on:click="clickDiv" class="dv1"> <input type="button" value="按钮" v-on:click.stop="clickBut"> </div> <a href="http://www.baidu.com" v-on:click.prevent="linkurl">去百度</a> <div v-on:click.capture="clickDiv" class="dv1"> <input type="button" value="捕获按钮" v-on:click.stop="clickButcapture"> </div><br> <div v-on:click.self="clickDiv" class="dv1"> <input type="button" value="按钮" v-on:click.stop="clickBut"> </div><br> <div v-on:click.once="clickDiv" class="dv1"> <input type="button" value="按钮" v-on:click.stop="clickBut"> </div> </div> <script src="vue.min.js"></script> <script> var vm = new Vue({ el:'#app', data:{ msg:'456' }, methods:{ clickDiv(){ console.log('点击了div') }, clickBut(){ console.log('点击了按钮') }, linkurl(){ console.log('a链接'); }, clickButcapture(){ console.log('捕获机制触发'); } } }); </script> </body> </html>
