vue 获取元素到页面顶部的距离_Vue获取页面元素的相对位置

今天在开发源码栏目，发现有一处需要获取元素的相对位置高度，发现getBoundingClientRect有一个问题，它是用于获取某个元素相对于视窗的位置集合，达不到我想要的要求，如是看到阮老师写的一篇文章，关于用Javascript获取页面元素的位置，很好解决了我的问题，我也扩展关于其它方法

发现问题

当我滚动到元素的位置时候，我想把元素固定在头部

// html 结构

• 首页推荐
• 最新发布

复制代码export default {

data(){

return {

isFixed:false,

}

},

mounted(){

if(this.$refs.subnav.getBoundingClientRect){

this.scrollTop(this.$refs.subnav.getBoundingClientRect())

}

},

methods:{

// 这是封装的一个方法

scrollTop(h){

console.log(h);

this.utils.scrollTop((res)=>{

this.isFixed = res.scrollH > h ? true :false;

})

}

}

}

复制代码

utils.js