Vue监听页面元素高度变化

使用Vue时，有时候需要获取页面渲染完成后某个元素的高度，但由于数据没有渲染完成，可能获取不到准确的高度，这时需要使用 watch结合this.$nextTick()来解决

watch:{
     
	listData:function(){
     
		this.$nextTick(function(){
     
			//some code
			console.log($('ul').height())//ul最新的高度
		})
	}
}

• nextTick：在下次DOM更新循环结束之后执行延迟回调。在修改数据之后立即使用这个方法，获取更新后的DOM
• watch：用于观察Vue实例上的数据变动。对应一个对象，键是观察表达式，值是对应回调

nextTick用途

应用场景：需要在视图更新之后，基于新的视图进行操作