目标：显示或隐藏一段文本
原理：v-if v-show
分析：
共同点：都可以通过该指令去控制文本的显示或者隐藏
不同点：v-if 直接从DOM上移除或者添加，
v-show 会在DOM上设置display:none属性
适用场景：如果经常显示或者隐藏文本v-show提升性能，如果不常操作显示或者隐藏v-if节省内存
例子：
<div v-if="show">
{{mes}}
</div>
<div v-show="show">
{{mes}}
</div>
var vm =new Vue({
el:"#app",
data:{
mes:"你好"，
show:true
}
})
v-if 与v-else
<div v-if="show">
{{mes}}
</div>
<div v-else>
A不可见我将显示
</div>
var vm =new Vue({
el:"#app",
data:{
show:true,
mes:"A我可以被看见",
}
})
网友评论