教育行業(yè)A股IPO第一股（股票代碼 003032）

全國(guó)咨詢/投訴熱線：400-618-4000

v-show和v-if的區(qū)別詳細(xì)介紹

更新時(shí)間:2020年09月14日16時(shí)42分 來(lái)源:v-show和v-if的區(qū)別 瀏覽次數(shù):

vue中顯隱方法常用兩種，v-show和v-if，但這兩種是有區(qū)別的。

實(shí)現(xiàn)本質(zhì)方法區(qū)別

v-show本質(zhì)就是標(biāo)簽display設(shè)置為none，控制隱藏

v-if是動(dòng)態(tài)的向DOM樹內(nèi)添加或者刪除DOM元素

編譯的區(qū)別

v-show其實(shí)就是在控制css

v-if切換有一個(gè)局部編譯/卸載的過(guò)程，切換過(guò)程中合適地銷毀和重建內(nèi)部的事件監(jiān)聽和子組件

編譯的條件

v-show都會(huì)編譯，初始值為false，只是將display設(shè)為none，但它也編譯了

v-if初始值為false，就不會(huì)編譯了

性能

v-show只編譯一次，后面其實(shí)就是控制css，而v-if不停的銷毀和創(chuàng)建，故v-show性能更好一點(diǎn)。

用法

v-if更靈活，例如

v-if與v-show



猜你喜歡：

Js語(yǔ)言解析：vue語(yǔ)言中的keep-alive 

Vue3為什么使用Proxy實(shí)現(xiàn)數(shù)據(jù)監(jiān)聽? 

0 分享到：
和我們?cè)诰€交談！