Vue中v-if和v-show之间的区别

Vue中v-if和v-show之间的区别

1.本质区别

v-show:把标签display设置为none,控制隐藏
v-if:动态的向DOM树内添加或者删除DOM元素

2.编译的区别

v-show:其实就是在控制css
v-if:切换有一个局部编译/卸载的过程,切换过程中合适地销毁和重建内部的事件
	监听和子组件

3.使用条件

只渲染一次使用v-if
反复渲染使用v-show

4.总结

v-if:不显示时,第一次就直接不渲染,如果内容以及显示就将其改为不显示,将内容
      直接从Dom去除,只是渲染一次用v-if
v-show:不显示时,就会改为display:none,但是会渲染在Dom上。所以反复切换内容
       的用v-show

猜你喜欢

转载自blog.csdn.net/weixin_49092628/article/details/111238892