温馨提示：本文共462个字，读完预计2分钟。

Vue中的条件渲染

 v-if和v-show都能一个模板标签是否能在页面显示。

显示时：相同

隐藏时：

v-if:不存在与dom之上

v-show:存在dom之上，以display:none的形式隐藏

v-show不会频繁的把dom从页面上删除或者添加。因此需要频繁的切换使用v-show效率更高。

v-if会在dom页面上添加或者删除。如果运行条件很少改变使用v-if更好

注意，v-show 不支持 <template> 元素，也不支持 v-else。

a除了v-if还有v-else。v-if和v-else要紧贴着使用

除了v-if和v-else还有v-else-if，也需要连在一起

         vue重新渲染时会尽量复用界面上存在的dom，因此下图的用户名切换到邮箱名的时候input的值不会变。因为在切换后vue发现以前的页面有一个input就复用了。

为了解决这个问题可以采用key值的方式。

不复用vue元素的方法：

当dom有key值时，vue会知道是页面上唯一的元素。如果两个dom的key值不一样，vue不会选择复用，会重新渲染。