24
2020
08

v-if 和 v-show 有什么区别

共同点:


v-if 和 v-show 都可以用来动态显示DOM元素。


区别:


编译过程: v-if 是真正的条件渲染,因为它会确保在切换过程中条件块内的事件监听器和子组件适当地被销毁和重建。v-show 的元素始终会被渲染并保留在 DOM 中。v-show 只是简单地切换元素的 CSS 属性 display。

编译条件: v-if 是惰性的,如果在初始渲染时条件为假,则什么也不做。直到条件第一次变为真时,才会开始渲染条件块。v-show 不管初始条件是什么,元素总是会被渲染,并且只是简单地基于 CSS 进行切换。

性能消耗: v-if有更高的切换消耗。v-show 有更高的初始渲染消耗。

应用场景: v-if适合运行时条件很少改变时使用。v-show 适合频繁切换。

« 上一篇 下一篇 »

发表评论:

◎欢迎参与讨论,请在这里发表您的看法、交流您的观点。