1.插值表達式 {{}}
作用：將vue數據模型中的數據顯示到視圖層中，只能使用在雙向標籤中間
例子：<p>{{name}}</p>
2.v-text
作用：將vue數據模型中的數據顯示到視圖層中，定義在開始標籤中，單向標籤和雙向標籤都可以使用
例子：<div v-text="content"></div>
3.v-html
作用：也是將vue數據模型中的數據顯示到視圖層中，與v-text區別在於，v-html可以解析數據中的html標籤，並顯示出來。而v-text只會原樣輸出。
例子：
`<div v-html="content"></div>
...省略
data: {
content: "<h1>hello</h1>"
}`
4.v-cloak
作用：解決插值表達刷新時出現閃爍問題，瀏覽器慢時會出現，先出現{{name}},再替換成name的屬性值，如果標籤加上v-cloak,瀏覽器會隱藏{{name}},而是再替換前顯示 空白。v-cloak需要配合style使用
例子：
<style>
[v-cloak] {
display: none;
}
</style>
</head>
<body>
<div id="app">
<!--
使用v-cloak來解決插值表達閃爍問題
配合樣式來使用：v-cloak加一個屬性：display:none
-->
<div v-cloak>{{content}}</div>
</div>
</body>
...省略部分代碼
data: {
content: 'abc'
}
5.v-if
作用：用來控制元素的顯示和隱藏，是DOM級別的操作，當爲false時，銷燬元素；當爲true時，插入元素。v-if也是惰性操作，如果一開始就是false的時候，頁面將不會有任何操作，直到變爲true時，纔會插入元素。
例子：
<div v-if="gender">這是一段話</div>
data: {
gender: false
}
6.v-show
作用：與v-if一樣，用於控制元素的顯示或者隱藏，是CSS級別操作，當爲false是，給元素添加display:none樣式；當元素爲true時，去掉display:none樣式。
例子：
<div v-show="show">這是一段話</div>
data: {
show: false
}
7.v-for
作用：遍歷循環數組，對象，整數，需要加上key屬性，v-for(… in …)
item爲遍歷的每一項
例子：
<ul>
<li v-for="(item, index) in arr">{{item}}------{{index}}</li>
</ul>
8.v-bind
作用：用來綁定屬性值，v-bind:屬性=“值”，也可簡寫爲’:屬性=“值”’
例子：
<a :href="src">點我去百度</a><br/>
<a v-bind="{href: '/update?id=' + id}">修改id爲5的數據</a>
...省略部分
data: {
src: "http://www.baidu.com",
id: 5
}
9.v-on
作用：可以用來 綁定事件 如 v-on:click 綁定點擊事件，也可寫成’@click‘
例子：
<input type="button" value="點我有驚喜" @click="go">
...省略部分
methods: {
go: function() {
console.log("我被點擊啦！");
}
}
10.v-model
作用：雙向綁定數據，在視圖顯示數據模型中的數據，也可以修改數據，當修改數據時，數據模型的數據也會被同時修改。
例子：
<input type="text" v-model="word">
data: {
word: "這是一段話"
}