vue document.documentElement.clientHeight为0

其实也不是获取不到,正常手机都能获取的到,但是在个别手机上面获取不到,个别手机指的是华为P20。
因为在Android端,如果你fbc之后getHeight()也是获取不到,我就想是不是mounted函数调用的时候,页面还没有渲染好呢,翻看了一下vue生命周期,果然是,于是我延迟300毫秒获取高度

setTimeOut(()=>{
  ...
},300)

并没有什么卵用,然后我灵光一现,发现vue有这么个方法

    this.$nextTick(() => {
        let height = document.documentElement.clientHeight - this.$refs.scrollWrapper.getBoundingClientRect().top
        this.wrapperHeight = height > 0 ? height : this.wrapperHeight;
      })

然而也没有什么卵用,因为页面是keepLive的,所以我上了个双保险

 activated() {
    window.onload = () => {
        this.wrapperHeight = document.documentElement.clientHeight - 
                                      this.$refs.scrollWrapper.getBoundingClientRect().top;
        console.log("this.wrapperHeight:" + this.wrapperHeight);
      };
    }

这个window.onload见名知意就是页面加载之后回调的,这回终于行了

你可能感兴趣的:(vue document.documentElement.clientHeight为0)