vue数据改变页面不更新问题 （nextTick方法）

背景

大伙在写vue代码的时候，经常遇到更新了数据页面却不更新的问题，很让人头疼。

正文

相信大家在寻找解决方法的时候，大部分都是调用数组的api来解决问题，但是也偶尔有像我一样即使调用了也不能解决页面不更新问题的时候。。。这时候vue.nextTick就要粉墨登场了！

vue.nextTick介绍

这个咱也不多说了。。。其他博主都介绍的很详细

如何用vue.nextTick方法解决数据改变页面不更新的问题

数据

data() {
			return {
				show: true,
				list: [
					'累了，不想学了',
					'偷偷卷',
					'今天学react'
				]
			}
		}

​渲染

<view v-if="show">
			<view v-for="(item,index) in list">
				{{item}}
			</view>
		</view>

watch属性

监测list变化

watch:{
			list(newVal,oldVal){
				let that = this
				
				that.show = false
				
				that.$nextTick(function(){
					console.log('更新');
					that.show = true
				})
			}
		},