分享一下我刚刚写的一个基于VUE的监听滚动事件固定导航菜单的方法

本人最近一直在研究VUE这个框架，刚刚遇到一个需要使用固定导航菜单的地方，现在写出来分享给大家，其实也会有很多种解决方案，性能上如何更高效也是见仁见智了，话不多说，直接上代码

1. 首先，在export default里我使用了window.addEventListener来监听scroll滚动事件，第一个参数为监听的事件类型，第二个参数传入一个回调函数，这个回调函数为handleScroll
   

 mounted (){
		  window.addEventListener('scroll', this.handleScroll) //此处监听scroll事件，并传入回调函数
		}

    2.然后methods中写入刚刚addEventListener中的handleScroll也就是实现监听滚动并实现判断的主要脚本

 var nav = document.getElementById('nav');//获取到包裹导航的最外层DIV的ID，并存入变量nav
 var scrollTop = window.pageYOffset || document.documentElement.scrollTop || document.body.scrollTop //此处将导航条的滚动存入scrolltop
if(scrollTop>50){    //逻辑判断此处的50为导航菜单上方标题栏DIV的高度，如果向下滚动导航菜单，触发下方的CSS样式更改
 nav.style.position = 'fixed';  //导航栏绝对定位
 nav.style.top = '0'; //导航距离顶部0像素，一直在顶部出现
 nav.style.zIndex = '99999';  //设置导航菜单层级优先度最高
 }else{
  nav.style.position = 'relative';  // 此处为导航菜单回拉后复原，根据项目需求来写，我觉得这里我写的是有些问题的，不过在我的项目中可以实现效果，具体要看情况
 }
}

情况就是这样啦，有什么问题的小伙伴请加我VX king951231我们一起探讨