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

一、v-if、v-show区别
  1. v-if、v-show都是用来控制元素的显示与隐藏
  2. v-if控制dom节点,v-if为false时移除元素
  3. v-show修改元素的display属性,v-show为false时隐藏元素
二、v-if 实例



    
    v-if
    
    


v-if

运行结果:
在这里插入图片描述
点击toggle隐藏段落,段落会从dom中移除
vue中v-if和v-show的区别_第1张图片

三、v-show实例



    
    v-show
    
    


v-show

运行结果:
vue中v-if和v-show的区别_第2张图片
点击toggle隐藏段落,段落会隐藏,段落在dom中还存在
vue中v-if和v-show的区别_第3张图片

你可能感兴趣的:(vue)