| v-if | v-show | |
| 方法 | 通過控制dom節點是否存在控制元素是否顯示 | 通過控制dom元素的display樣式控制元素是否顯示 |
| 渲染 | v-if是惰性的，根據條件渲染切換中銷燬或者重建子組件，v-if條件爲假時是不編譯 | 始終存在只是改變css樣式，始終編譯會被緩存 |
| 性能消耗 | 較多的切換消耗 | 較多的初始化渲染消耗 |
| 使用場景 | 運行時條件改變較少，多條件判斷時 | 運行時條件多次改變(頻繁操作dom對性能影響很大) |
| 注意事項 | 當出現v-show 以及v-if 不生效，沒有根據數組中的值的變化而變化時，請檢查數組中的值的變化是否是通過Vue.set來執行修改
以下代碼中 <div v-show="lists[0].show"></div> 正確的寫法應該如下 list=lists[0] Vue.set(list,"show",true) |
|
| v-if能和v-else連用進行分支判斷 | v-show是不能和v-else連用的 | |