不同點

1、實現(xiàn)方式

• v-if是根據(jù)后面數(shù)據(jù)的真假值判斷直接從Dom樹上刪除或重建元素節(jié)點；
• v-show只是在修改元素的css樣式，也就是display的屬性值，元素始終在Dom樹上。

2、編譯過程

• v-if切換有一個局部編譯/卸載的過程，切換過程中合適地銷毀和重建內(nèi)部的事件監(jiān)聽和子組件；
• v-show只是簡單的基于css切換；

3、編譯條件

• v-if是惰性的，如果初始條件為假，則什么也不做；只有在條件第一次變?yōu)檎鏁r才開始局部編譯；
• v-show是在任何條件下（首次條件是否為真）都被編譯，然后被緩存，而且DOM元素始終被保留；

4、性能消耗

• v-if有更高的切換消耗，不適合做頻繁的切換；
• v-show有更高的初始渲染消耗，適合做頻繁的額切換；