页面滚动到某个位置触发动画效果 -- 响应式页面

布局时需要用到 window.pageYOffset 判断滚动位置触发动画，但是页面采用响应式布局，高度无法通过 px 单位确定。现考虑如下方法

getHeight() {
  const scrollTop = window.pageYOffset
   // 当 [窗口下沿滚动距离] 超过 [上一个模块底边与页面顶部距离] 时触发渐入动画
  this.show = scrollTop + innerHeight > this.ToPageTop(this.$refs.sec3) + this.$refs.sec3.style.height

其中获取元素到页面顶部距离 – 采用递归累加 offsetTop 方法

ToPageTop(element) {
  if (element.parentElement) {
     return this.ToPageTop(element.parentElement) + element.offsetTop
  }
  return element.offsetTop
},

其中 sec3 为 待触发动画元素 的 上一个元素区域 (上下排列)
笨方法 😅，如果想到更优解再补充