为什么scrollTop总是返回0

像一个vue项目，子div可能作为一个页面的视窗大小,高宽都是100vh/vw，这时候document.getElementById('wrapper').scrollTop会一直返回0，而且同样的元素调用ScrollTo也会失效。

<template>
  <div id="root">
    <div>
      <div>
        <div>
          <div>
            <div>
              <div id="wraper" style="height:100vh;100vw;position:relative">
                <div style="height:90px"></div>
                <div id="long" style="height:500vh;100vw;background:rgb(0,0,0,0.3)">
                </div>
              </div>
            </div>
          </div>
        </div>
      </div>
    </div>
  </div>
</template>

这里有个坑，就是你必须指明会scroll的元素具有溢出后滚动的属性，虽然它默认就是溢出后滚动（默认值是auto），但是你还要指明一下。这个坑我搞了快一个上午，最后在以为外国博主Dani Kim的一片博客上面找到了答案
修改为

<template>
  <div id="root">
    <div>
      <div>
        <div>
          <div>
            <div>
              <div id="wraper" style="overflow:scroll;height:100vh;100vw;position:relative">
                <div style="height:90px"></div>
                <div id="long" style="height:500vh;100vw;background:rgb(0,0,0,0.3)">
                </div>
              </div>
            </div>
          </div>
        </div>
      </div>
    </div>
  </div>
</template>

就能够获取scrollTop并且设置scrollTo（）了！

不得不说外国人写的技术博客真的好详细啊！