vant tabs sticky模式下的bug

vant tabs sticky模式下，本来应该在滑动一段距离后才吸顶，结果页面加载完成就吸顶了。

解决方式:给sticky属性增加一个控制变量，当页面滑动时，变量置为true。

实施：

1、给tabs外层增加一个父级用于滚动监听，css设置：

height: calc(100vh - 54px);

 overflow: hidden scroll;

2、添加监听：

methods中增加滚动处理函数

  handleScroll() {

      let top = document.querySelector(".list-new").scrollTop;

      if (top > 80 && !this.stickyFlag) {

        this.stickyFlag = true;

      }

    }

mounted中增加

 document

      .querySelector(".list-new")

      .addEventListener("scroll", this.handleScroll);

因为只是页面加载时有问题，正常滑动之后没有问题了，所以控制变量的值一直未true也没有问题。

    <div class="list-new">
      <van-tabs
        v-model="active"
        :sticky="stickyFlag"
        :offset-top="54"
        scrollspy
      >
        <van-tab
          v-for="section in dataShow"
          :key="`section.type-${section.num}`"
        >
          <template #title>
            {{ section.type }}刊{{ section.data.length }}</template
          >
        </van-tab>
      </van-tabs>
    </div>

另：tabs每次引用我都犯的错误：没有设置offset-top的值，导致滚动后看不到吸顶，因为我的页面顶部都有个自定义的导航给挡住了，汗颜。