一、 v-if
1. <div v-if="true"> if 不隱藏</div>
2. <div v-if="false"> if 隱藏</div>
-
v-if 是控制dom的存在與否來(lái)控制元素的顯示隱藏。
-
v-if也是惰性的 如果初始化條件為true則渲染,如果為false則什么都不做,所以v-if有更高的切換消耗
1.png
二、 v-show
1. <div v-show="true"> show 不隱藏</div>
2. <div v-show="false"> show 隱藏</div>
-
v-show 只是基于簡(jiǎn)單的css切換 使用display 有兩個(gè)屬性值 一個(gè)是none進(jìn)行隱藏 block 進(jìn)行顯示 v-show有更高的初始渲染消耗
2.png
三、 使用場(chǎng)景
如果在項(xiàng)目中 頻繁的使用到顯示隱藏那么使用v-show 就行 如果不經(jīng)常使用到顯示隱藏就使用v-if 具體操作還是得看需求
