导航栏滚动到顶部固定

<div id="testNavBar">
      <div :class="{ fixedNavbar: isfixTab }">这是导航</div>
    </div>

mounted() {
     window.addEventListener('scroll', this.handleTabFix, true)
  },
  methods: {
    // 先分别获得id为testNavBar的元素距离顶部的距离和页面滚动的距离
	// 比较他们的大小来确定是否添加fixedNavbar样式
    handleTabFix() {
      var scrollTop = window.pageYOffset || document.documentElement.scrollTop || document.body.scrollTop
      console.log(scrollTop)
      var offsetTop = document.querySelector('#testNavBar').offsetTop
      scrollTop > offsetTop ? this.isfixTab = true : this.isfixTab = false
    }

  },
    //离开当前组件前一定要清除滚动监听，否则进入其他路由会报错
beforeRouteLeave (to, from, next) {
   window.removeEventListener('scroll', this.handleTabFix, true)
   next()
},

.fixedNavbar{
    position: fixed;
    top: 2.25rem;
    left: 0;
    width: 100%;
    border-top: 0.05rem solid #f5f5f5;
    border-bottom: 0.05rem solid #f5f5f5;
    background: #f5f5f5;
}