Vue指令：v-if和v-show的区别

Vue指令：v-if和v-show的区别

在进行vue项目开发过程中，v-if和v-show是比较常用的Vue指令，经常用来判断渲染部分代码块，但两者具体的区别在哪里呢：
首先说说v-if指令，看到if相信很多小伙伴会联想到js语法里面的if判断，v-if和js里的if差不多，也会有v-else-if和v-else，只是js里的if判断是用于在js语法里面的判断，v-if在vue中是对于代码块的判断；

<p v-if=true>现在你看到我了</p>

如上代码，当指令的判断为true时，p标签则会生成，进而在页面中显示出来，反之在编译时不会生成p标签。
再来看看v-show指令，也是判定指定的代码块是否显示，但不管判断的条件是true还是false，代码块都会被编译出来；

<p v-show=true>现在你看到我了</p>

如上代码，当条件为true时，代码块正常显示在页面上，为false时，代码块也会生成，但是dom节点中把该元素设置css属性为display : none，元素依然保留在dom节点中。
所以，在功能上，两者都比较类似，但是两者的使用场景却不太一样，v-if一般用于页面元素在初始化后改动比较少的场景，而v-show则是多用于修改页面比较频繁，局部代码要反复进行判断的场景