vueJs 中 v-if和v-show的比较

1. 实现方法的不同

v-if 是直接销毁或者重建dom

v-show 修改css样式,dom元素始终存在,修改的是display的值

2. 编译过程

v-if 切换时,有个局部编译/卸载的过程,切换过程中合适的销毁和重建内部的事件监听和子组件

v-show 只是简单的display的值得改变,并不该变其他

扫描二维码关注公众号,回复: 3533943 查看本文章

3. 编译条件

v-if是惰性的,只有值为真是,才开始局部编译

v-show无论值是否为真,都将编译,并被缓存。dom节点始终存在

4. 性能消耗

v-if 在做频繁的切换时,性能消耗大,适合只做初始判断的

v-show 初始渲染消耗高,但是后期的切换,消耗小,适合做切换按钮一类

猜你喜欢

转载自blog.csdn.net/y1s2y3/article/details/82700282