所說的吸頂效果就是在頁面沒有滑動之前，導航欄的效果如下圖所示：

當頁面向上滑動之后，導航欄始終固定在頁面的上方。

具體代碼：

寫入事件監(jiān)聽，監(jiān)聽滾動條。

mounted () {
      // 事件監(jiān)聽滾動條
      window.addEventListener('scroll', this.watchScroll)
    }

然后在 methods 中寫入 watchScroll 方法。

methods: {
      watchScroll () {
        var scrollTop = window.pageYOffset || document.documentElement.scrollTop || document.body.scrollTop
        //  當滾動超過 50 時，實現(xiàn)吸頂效果
        if (scrollTop > 49) {
          this.navBarFixed = true
        } else {
          this.navBarFixed = false
        }
     }
}

在對應的標簽中加入修改后的樣式

<div :class="navBarFixed == true ? 'navBarWrap' :''">

.navBarWrap {
    position:fixed;
    top:0;
    z-index:999;
  }

END~~