Vant 顶部导航栏【van-tabs】Bug

最新推荐文章于 2025-07-29 11:34:02 发布

原创最新推荐文章于 2025-07-29 11:34:02 发布 · 5.1w 阅读

2 ·

CC 4.0 BY-SA版权

文章标签：

#vant #vue #van-tabs

vue 同时被 2 个专栏收录

17 篇文章

订阅专栏

vant

3 篇文章

订阅专栏

本文详细描述了Vant UI框架中顶部导航栏【van-tabs】组件在使用v-show控制显示隐藏时出现的导航条不准确的问题。通过实例代码展示问题现象，并提出了解决方案，即使用v-if替代v-show。同时，文章提及了评论区关于吸顶效果的处理方法，提供了官方文档链接以供参考。

Vant 顶部导航栏【van-tabs】Bug

如果在外面包裹div控制显示隐藏会出现导航条不准确的bug

代码


<div class="selWrap" v-show="showSelWrap" >

  <van-tabs v-model="active">

    <van-tab title="过关">

      111

    </van-tab>

    <van-tab title="单关">

      内容 6

    </van-tab>

  </van-tabs>

  <!--<div class="mask"></div>-->

</div>

效果