- Vue.js從入門到項目實踐(超值版)
- 聚慕課教育研發中心編著
- 323字
- 2022-07-29 14:27:39
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有較高的初始渲染消耗,適合做頻繁的切換。
推薦閱讀
- JSP網站開發詳解
- Dreamweaver CS5網頁設計與制作教程
- 網站建設與網頁設計從入門到精通Dreamweaver+Flash+Photoshop+HTML+CSS+JavaScript
- 中文版Dreamweaver CS6/Flash CS6/Photoshop CS6網頁設計基礎培訓
- 網頁配色從入門到精通
- After Effects CS6從入門到精通
- 網頁設計那些事兒
- Web前端開發精品課 HTML與CSS進階教程
- 動態網頁設計與制作(HTML5+CSS3+JavaScript)(第3版)
- 電子商務網頁設計(第二版)
- 人人都玩開心網:Ext JS+Android+SSH整合開發Web與移動SNS
- Web開發者晉級之道:架構、模式和領域驅動設計
- Vue.js核心技術解析與uni-app跨平臺實戰開發
- ASP快速建站全程實錄
- 精通HTML5+CSS3+JavaScript網頁設計(視頻教學版)(第2版)