Vue的条件渲染

v-if、v-else、v-else-if以及v-show的用法

• v-if的渲染方式：

  • 会确保在切换过程中条件块内的事件监听器和子组件适当地被销毁和重建；
  • 只有当条件第一次变为真时，才会开始渲染条件块；
  • 切换开销比v-show高；

• v-show的渲染方式：

  • 不管初始条件是什么，元素总是会被渲染；
  • 只是简单地基于 CSS 进行切换；
  • v-show的初始渲染开销比v-if高；

如果需要频繁的切换，则使用v-show；

如果运行时条件很少改变，则用v-if；

  
  
  


  

    
优秀
    
良好
    
一般
    
比较差
    
测试v-show
    点击