3.4.1　面試技巧與解析（一）

面試官：v-if和v-show有什么區別？

應聘者：

（1）相同點：兩者都是在判斷DOM節點是否要顯示。

（2）不同點：

①實現方式。v-if是根據后面數據的真假值，判斷直接從DOM樹上刪除或重建元素節點；v-show只是修改元素的CSS樣式，也就是display的屬性值，元素始終在DOM樹上。

②編譯過程。v-if切換有一個局部編譯/卸載的過程，切換過程中合適地銷毀和重建內部的事件監聽和子組件；v-show只是簡單地基于CSS切換。

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

④性能消耗。v-if有較高的切換消耗，不適合做頻繁的切換；而v-show有較高的初始渲染消耗，適合做頻繁的切換。