码迷,mamicode.com
首页 > 其他好文 > 详细

vue中v-show与v-if的区别

时间:2018-01-04 00:32:21      阅读:150      评论:0      收藏:0      [点我收藏+]

标签:数据绑定   保留   重建   过程   ui组件   css   复用   目的   条件   

之前在做项目的过程中,因为有用到element-ui组件用到了v-if进行排版渲染,可能是因为v-if,会把编译缓存起来,所以切换的过程中一直会有复用的形式,导致样式怎么也不对,之后换成v-show就好了。在切换 v-if 块时,Vue.js 有一个局部编译/卸载过程,因为 v-if 之中的模板也可能包括数据绑定或子组件。v-if 是真实的条件渲染,因为它会确保条件块在切换当中合适地销毁与重建条件块内的事件监听器和子组件。v-if 也是惰性的:如果在初始渲染时条件为假,则什么也不做——在条件第一次变为真时才开始局部编译(编译会被缓存起来)。相比之下,v-show 简单得多——元素始终被编译并保留,只是简单地基于 CSS 切换。一般来说,v-if 有更高的切换消耗而 v-show 有更高的初始渲染消耗。因此,如果需要频繁切换 v-show 较好,如果在运行时条件不大可能改变 v-if 较好。

vue中v-show与v-if的区别

标签:数据绑定   保留   重建   过程   ui组件   css   复用   目的   条件   

原文地址:https://www.cnblogs.com/627laq/p/8185987.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!