欢迎来到代码驿站!

vue

当前位置:首页 > 网页前端 > vue

Vue在页面数据渲染完成之后的调用方法

时间:2020-11-16 12:04:27|栏目:vue|点击:

在使用Vue框架的时候,有时候需要在Vue在页面数据渲染完成之后调用方法,不然获取不到准确的数据,特别是在获取列表的高度的时候,由于数据没有加载完,获取不到准确的高度。之前在使用jquery的时候,有ready可以帮助我们实现,但是Vue不存在此类方法,我们需要结合watch和this.$nextTick()来实现。

nextTick:在下次 DOM 更新循环结束之后执行延迟回调。

watch:用于观察Vue实例上的数据变动。对应一个对象,键是观察表达式,值是对应回调。

之前我是这样子使用nextTick的:

mounted:{

this.$nextTick(function(){

/////方法

})

}

经测试发现实现不了所需要的效果,只有结构,没有数据,即获取不到想要的高度

后发现需要结合watch监听某个属性:

watch:{

asyncArray:function()

 this.$nextTick(function(){
  //////方法
 });
}
}

经测试可用!

上一篇:原生Vue 实现右键菜单组件功能

栏    目:vue

下一篇:Vue SSR 即时编译技术的实现

本文标题:Vue在页面数据渲染完成之后的调用方法

本文地址:http://www.codeinn.net/misctech/23177.html

推荐教程

广告投放 | 联系我们 | 版权申明

重要申明:本站所有的文章、图片、评论等,均由网友发表或上传并维护或收集自网络,属个人行为,与本站立场无关。

如果侵犯了您的权利,请与我们联系,我们将在24小时内进行处理、任何非本站因素导致的法律后果,本站均不负任何责任。

联系QQ:914707363 | 邮箱:codeinn#126.com(#换成@)

Copyright © 2020 代码驿站 版权所有