Vue裏面的v-if與v-show的區別：
v-if依賴於控制DOM節點，而v-show是依賴於控制DOM節點的display屬性。
共同點：
v-if和v-show都是用來控制元素的渲染。v-if判斷是否加載，能夠減輕服務器的壓力，在須要時加載,但有更高的切換開銷;v-show調整DOM元素的CSS的dispaly屬性，能夠使客戶端操做更加流暢，但有更高的初始渲染開銷。
特色：
v-if 的特色：每次都會從新刪除或建立元素
v-show 的特色： 每次不會從新進行DOM的刪除和建立操做，只是切換了元素的 display:none 樣式 。
消耗：
v-if 有較高的切換性能消耗
v-show 有較高的初始渲染消耗
vue中經常使用指令：
指令
v-text
v-html
v-bind
v-on
v-model
v-for
代碼
學習技術最好仍是要看下代碼是什麼樣的。
v-text
解釋：更新DOM對象的 textContent
<h1 v-text="msg"></h1>
v-html
解釋：更新DOM對象的 innerHTML
<h1 v-html="msg"></h1>
v-bind
做用：當表達式的值改變時，將其產生的連帶影響，響應式地做用於 DOM
語法：
v-bind:title="msg"
// 簡寫：:title="msg"
<!-- 完整語法 -->
<a v-bind:href="url"></a>
<!-- 縮寫 -->
<a :href="url"></a>
v-on
做用：綁定事件
語法：v-on:click="say" or v-on:click="say('參數', $event)"
簡寫：@click="say"
說明：綁定的事件定義在methods
<!-- 完整語法 -->
<a v-on:click="doSomething"></a>
<!-- 縮寫 -->
<a @click="doSomething"></a>
v-model
做用：在表單元素上建立雙向數據綁定
說明：監聽用戶的輸入事件以更新數據
<input type="text" v-model="message" placeholder="edit me">
<p>Message is: {{ message }}</p>
v-for
做用：基於源數據屢次渲染元素或模板塊
<div v-for="item in items">
{{ item.text }}
</div>
<!-- item 爲當前項，index 爲索引 -->
<p v-for="(item, index) in list">{{item}} -- {{index}}</p>
<!-- item 爲值，key 爲鍵，index 爲索引 -->
<p v-for="(item, key, index) in obj">{{item}} -- {{key}}</p>
僅供參考。