vue 中 获取页面卷进去的宽度或高度

vue项目中，获取TMD页面卷进去的高度总失败，比如：

let top = document.documentElement.scrollTop || document.body.scrollTop;

console.log(top)// 0;

沃特法克，放在原生写法里，该是多少就打印多少；

于是乎，打印了一下window对象。发现有个window.pageYOffset 属性，以前没见过啊。后来验证才知道，也是页面卷进去的纵向距离，即高度（Y轴）；

如上 即为 卷入的X 轴 Y轴距离;

 

考虑到PC端或者移动端，浏览器无非就是QQ浏览器，360，猎豹，火狐，谷歌等等，所以加入了兼容写法:

1. //兼容的获取页面卷进去的宽高

2. function getScroll () {

3.     return {

4.         left: window.pageXOffset || document.documentElement.scrollLeft ||   document.body.scrollLeft || 0,

5.         top: window.pageYOffset || document.documentElement.scrollTop ||   document.body.scrollTop || 0

6.               }

7. }

可以将函数注册到组件中的自定义方法里，也可以绑定到vue的原型上,这样就变成了共享的方法,或者新建一个js并引入使用，都可以.

取值的话 就是getScroll().left 或getScroll().top 即可得到相应的值;

这样拿到值以后 我们可以写自己想要的一系列效果......

以后都是个人尝试了好几次，最后认为较为完美了，不足之处，欢迎指正并探讨