浅层次的讲下使用与区别:
此次只针对渲染方向
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决定是否渲染列表页,这样过可以做到从详情页返回时会到的就是进入详情页前的列表页。

Logo

前往低代码交流专区

更多推荐