vue中v-show与v-if使用与简单的应用场景

浅层次的讲下使用与区别:
此次只针对渲染方向
v—show,顾名思义,vue中通过值来判断是否显示加载并显示,

v-if,通过值来来判断是否加载,
看起来几户一样,具体实现原理不同,简单的讲就是v-show是一直都有将元素加载,只是将元素设置为display,v-if则是判断值是否为真来选择是否加载元素。直白的说,就是如果v-show包含的元素中含有自动执行的方法,即使v-show的对应的值为假不展示也会执行,但是如果v-if对应的值为假,则不会进行加载。

//标签部分
<div v-show="isShow">v-show</div>
<div v-if="ifShow">v-if</div>

//数据部分
data(){
return {
	isShow:true,
	ifShwo:false
}
}

一个简单的应用场景就是列表页与详情页之间切换的时候,通过v-if来决定是否渲染详情页,通过v-show决定是否渲染列表页,这样过可以做到从详情页返回时会到的就是进入详情页前的列表页。

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值