在$nextTick中获取DOM高度的问题

再做一个滚动的功能,需要获取到被滚动元素的高度
代码如下

    created() {
      this.titleid = this.$route.params.titleid
      this.communityid = this.$route.params.communityid
      this.TOPIC_LOADORDERBY({titleid: this.titleid, communityid: this.communityid})
       this.$nextTick(function () {
           // DOM 现在更新了
           // `this` 绑定到当前实例
           this._initScroll()
           let self = this;
               console.log(self.$refs.scorll.clientHeight)
               console.log(self.$refs)
               let height = self.$refs.scorll.clientHeight - self.$refs.topicReply.clientHeight;
                self.meunScroll.scrollTo(0, -height,0)

        })

我发现得到的值并不是实际高度的值,最初我怀疑是不是数据没有渲染进去,于是查看了一下DOM中属性的值,发现内容都是有的,就连clientHeight的值也是我需要的准确的值,但是不知道为什么我获取clientHeight值的时候却并不是我想要的,我尝试了使用定时器,但是结果还是一样的当时间只有在1000的时候才能获取到确切的高度;

阅读 7.4k
3 个回答

在created的钩子函数中,模板还没渲染好,试试mounted

我的情况使用setTimeout(()=>{},0)可以获取到dom的height,只使用$nextTick还不行

ref元素获取放到mounted中去执行。$nextTick是说数据更新之后触发的dom更新;二者不冲突,但是时机用得不对。

撰写回答
你尚未登录,登录后可以
  • 和开发者交流问题的细节
  • 关注并接收问题和回答的更新提醒
  • 参与内容的编辑和改进,让解决方法与时俱进
推荐问题