在頁面層次結(jié)構(gòu)，數(shù)據(jù)較多的時(shí)候，用v-if或者v-show就會(huì)出現(xiàn)div閃現(xiàn)，或者部分閃爍的結(jié)果。

可以在根元素添加v-cloak來解決，并且設(shè)置它的樣式即可。

代碼只是示例，還需要自己修改測(cè)試。

Document

[v-cloak]

{

display: none;

}

content

new Vue(

{

el: '#app',

data ()

{

return {

isShow: false

}

}

})

下面看下vue中v-if和v-show的區(qū)別

相同點(diǎn)

兩者都是在判斷DOM節(jié)點(diǎn)是否要顯示。

不同點(diǎn)

1、實(shí)現(xiàn)方式

v-if是根據(jù)后面數(shù)據(jù)的真假值判斷直接從Dom樹上刪除或重建元素節(jié)點(diǎn)

v-show只是在修改元素的css樣式，也就是display的屬性值，元素始終在Dom樹上。123

2、編譯過程

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

v-show只是簡(jiǎn)單的基于css切換；123

3、編譯條件

v-if是惰性的，如果初始條件為假，則什么也不做；只有在條件第一次變?yōu)檎鏁r(shí)才開始局部編譯；

v-show是在任何條件下(首次條件是否為真)都被編譯，然后被緩存，而且DOM元素始終被保留； 123

4、性能消耗

v-if有更高的切換消耗，不適合做頻繁的切換；

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

總結(jié)

以上所述是小編給大家介紹的vue使用v-if v-show頁面閃爍,div閃現(xiàn)的解決方法，希望對(duì)大家有所幫助，如果大家有任何疑問請(qǐng)給我留言，小編會(huì)及時(shí)回復(fù)大家的。在此也非常感謝大家對(duì)腳本之家網(wǎng)站的支持！

創(chuàng)作挑戰(zhàn)賽新人創(chuàng)作獎(jiǎng)勵(lì)來咯，堅(jiān)持創(chuàng)作打卡瓜分現(xiàn)金大獎(jiǎng)

總結(jié)

以上是生活随笔為你收集整理的c2010页面闪现_vue使用v-if v-show页面闪烁,div闪现的解决方法的全部?jī)?nèi)容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網(wǎng)站內(nèi)容還不錯(cuò)，歡迎將生活随笔推薦給好友。