vue中的常用指令（上）

先做一下基本的结构

<script>
		var vm = new Vue({
			el:'#app',
			data:{
				msg1 : '大家好，我是msg1',
				msg2 : '<h1>大家好，我是msg2</h1>',
				title : '这是一个自定义的title'
			},
			methods : {
				show:function(){
					alert("hello,mother fuck!")
				}
			}
		})
	</script>

1. v-cloak和v-txet
   使用v-cloak可以解决插值表达式闪烁的问题
   默认v-text也没有闪烁的问题

<div id="app">
		<p>{{msg1}}</p>
		<p v-cloak>-----{{msg1}}------</p>
		<div v-text = "msg1">===========</div>
	</div>

二者对比如下：
可以看出：v-text会覆盖元素原来的内容，但是v-cloak只会替换自己的这个占位符，不会把整个元素清空
2. v-html
v-html与前两者的用法相同，但是它能够往页面中添加标签混合元素
3. v-bind和v-on
①v-bind是为元素绑定属性（简写为:）
②v-on是为元素添加事件（简写为@）

<input type="button" value = "绑定属性" v-bind:title = "title">
<input type="button" value = "演示" v-on:click = "show">