其实也不是获取不到,正常手机都能获取的到,但是在个别手机上面获取不到,个别手机指的是华为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见名知意就是页面加载之后回调的,这回终于行了