v-if
元素始终会被渲染并保留在dom中。
v-show
只是简单地切换元素的css属性display。
v-if
和v-show
的区别和使用时机:
1.v-if
是 真正的条件渲染
因为他会确保在切换过程中,条件块内的事件监听器和子组件适当被销毁和重建。
2.v-if
是惰性的
如果在出事的渲染条件为假的时候,则什么都不做,直到第一次调键位真时,才会开始渲染条件块。
3.相比之下
v-show
简单的多-不管条件是什么,元素总会被渲染,并且只是简单地基于css进行切换。
v-if
有更高的切换开销,而v-show
又更高的初始渲染开销,因此,如果需要频繁地切换,应该用v-show
较好,如果运行条件很少改变,使用v-if
好一些。
***v-if
和v-for
不推荐一起使用
当v-if
和v-show
同时使用的时候,v-for
比v-if
有更高的优先级。