v-if和v-show相同之處
v-if 和 v-show 都具有條件判斷的功能，如下面案例所示，“hello word” 都會在瀏覽器上消失
<body>
<div id="app">
<h2 v-if="isshow" >{{message}}</h2>
<h2 v-show="isshow" >{{message}}</h2>
</div>
<script src="../vue.js"></script>
<script>
var app = new Vue({
el:'#app',
data:{
message:"hello world",
isshow:true
}
})
</script>
</body>
v-if和v-show不同之處
現在將上面兩個h2標籤裏分別加上不同的id屬性，和上面執行相同的步驟，“hello word” 也都會在瀏覽器上消失，究竟有什麼不同呢？？
<div id="app">
<h2 v-if="isshow" id="if">{{message}}</h2>
<h2 v-show="isshow" id="show">{{message}}</h2>
</div>
在控制檯中發現有一個h2標籤消失了，有一個h2標籤只是隱藏了，而隱藏的標籤正是v-show的標籤
總結
（1）v-if條件爲false時，包含 v-if 指令的元素根本就 不會存在 dom中。 而v-show條件爲false時，v-show只是給我們的元素增加了一個行內樣式：display:none
（2）開發中如何選擇
當需要在顯示和隱藏之間切換很頻繁時，使用v-show。當只有一次切換時，通過使用 v-if