小程序 v-if图片闪现 和v-show踩过的坑

有时候需要用data.length判断有数据才循环遍历显示，v-if用多了页面加载时图片会闪一下，用了v-show代替，如果初始化直接写js常见的6中false情况，然后3秒后赋值为js常见的真v-if、v-show都是正常的，但是许多时候我都是用array.length来判断有数据才显示，就会有些小问题，不会更新

///<invite-award  v-show="inviNumber"  ></invite-award> 写在组件里也不会更新
<template v-if="testShow.length">
	<view>v---if</view>
</template>
<template v-show="false"> //！！template里写v-show不起效果
		{{vShow}}
	<view v-show="testShow.length">v----show---2</view>
</template>
data() {
	return {
		testShow:[]
	}
},
onShow() {
	setTimeout(res=>{
		this.testShow = [1]
	},3000)
}

3秒后v-show不能像v-if一样正常更新

解决方法

一、watch
二、computed
其他方法(￣▽￣)~*欢迎留言讨论

//<view v-show="watchlength">v----show---2</view>
data() {
	return {
		testShow:[],
		watchlength:0
	}
},
watch:{
	testShow:function(newv,old){
		this.watchlength = newv.length;
	}
},
//<view v-show="vShow">v----show---2</view>
computed:{
	vShow:function(){
		return this.testShow.length
	}
}