模版--v-if、v-show

v-if

指令用于条件渲染。当v-if 指令的表达式的值为真时，对应的元素会被渲染到DOM中。如果表达式的值为假，该元素则不会被渲染

?

1 2 3 4 5 6 7 8 9 10 11

<div id="app">     <h1 v-if="showMessage">你好，世界！</h1> </div>     var app = new Vue({   el: '#app',   data: {     showMessage: true   } })

 如果showMessage 的值为true，那么<h1> 标签会显示在页面上

 

v-show

是另一种用于控制元素显示与隐藏的指令

 

区别：

v-show 适用于需要频繁切换显示状态的元素，因为它避免了不必要的DOM操作，可能会带来更好的性能表现。相比之下，v-if 更适合于条件不经常改变的情况