Vue监听页面元素高度变化
使用Vue时,有时候需要获取页面渲染完成后某个元素的高度,但由于数据没有渲染完成,可能获取不到准确的高度,这时需要使用 watch结合this.$nextTick()来解决watch:{listData:function(){this.$nextTick(function(){//some codeconsole.log($('ul').height())//ul最新的...
·
使用Vue
时,有时候需要获取页面渲染完成后某个元素的高度,但由于数据没有渲染完成,可能获取不到准确的高度,这时需要使用 watch
结合this.$nextTick()
来解决
watch:{
listData:function(){
this.$nextTick(function(){
//some code
console.log($('ul').height())//ul最新的高度
})
}
}
nextTick
:在下次DOM
更新循环结束之后执行延迟回调。在修改数据之后立即使用这个方法,获取更新后的DOM
watch
:用于观察Vue
实例上的数据变动。对应一个对象,键是观察表达式,值是对应回调
nextTick
用途
应用场景:需要在视图更新之后,基于新的视图进行操作
更多推荐
已为社区贡献1条内容
所有评论(0)