vue吸顶导航

更新一下，这里用了两种办法来做吸顶导航，一种是原生的滚动监听，一种是用better-scorll监听滚动，做一个假导航，在滚动到相应位置后显示。

这种是原生的方法
html导航

 <div class="contain">
    <div class="nav-bar-wrap">
      <ul class="banner">
        <li
          v-for="value in banner_list"
          :key="value"
          @click="clickTab(value)"
          :class="{ active: value === isActive}" >
          {
   {
    value }}
        </li>
      </ul>
    </div>

挂载后绑定监听事件啦

 mounted() {
   
    window.addEventListener("scroll", this.handScroll);
    let bann = document.querySelector(".banner");
    this.bannerTop = bann.offsetTop;
    console.log("offsetTop", this.bannerTop);
  },

滚动事件，获取滚动高度和元素离窗口的高

  handScroll() {
   
      let scrolltop =
        document.documentElement.scrollTop ||
        document.body.scrollTop ||
        window