v-if 和 v-show 的區別

v-if 和 v-show 的區別

v-if 和 v-show 在頁面都展示爲顯示隱藏

如：

<div v-if=""></div> 

v-if 爲true的時候，div顯示，當爲false的時候，div消失，代碼也消失，相當於刪除了div，當爲true的時候在重新渲染出來這個div；他是惰性的，只有爲真的時候纔會被渲染，否則什麼也不做；而且還有v-if 和v-else

<div v-if="flase"></div>
<div v-else></div>

if-show也是爲true的時候顯示，爲false的時候隱藏，但是他不會消失，相當於css的display：none；也就是說總是會被渲染；

一般來說， v-if 有更高的切換開銷，而 v-show 有更高的初始渲染開銷。因此，如果需要非常頻繁地切換，則使用 v-show 較好；如果在運行時條件不太可能改變，則使用 v-if 較好。