v-show选择显示

v-show是一种简化的判断显示, 相当于 if 判断+ show显示 的组合, 如果条件成立, 那么显示, 否则不显示.

<script src="https://cdn.jsdelivr.net/npm/vue/dist/vue.js"></script>
<h2>v-show指令</h2>
<div id="app">
	<h2 v-show="a1">a1的属性值是true</h2>
	<h2 v-show="a2">a2的属性值是true则显示</h2>
	<h2 v-show="age<30">年龄小于30岁</h2>
	<h2 v-show="name=='张三'">我叫{{name}}</h2>
</div>
<script>
	var vm = new Vue({
		el:'#app',
		data:{
			a1:true,
			a2:false,
			age:22,
			name:'张三'
		}
	});
</script>

v-show的原理是, 使用了 display:none 进行了控制.