Vant Tabbar切换时页面不刷新怎么办？

轩辕书錦提问于 2026-03-13 20:54:20 阅读 5

组件

我在用 Vant 的 Tabbar 做底部导航，点击不同 tab 时路由能跳转，但页面内容没更新，看起来像是组件被缓存了。我试过加 :key="$route.fullPath" 也没用，是不是 Tabbar 本身的问题？

这是我的 Tabbar 代码：

<van-tabbar v-model="active" active-color="#ee0a24">
  <van-tabbar-item
    v-for="item in tabs"
    :key="item.path"
    :to="item.path"
    :name="item.name"
  >
    {{ item.text }}
  </van-tabbar-item>
</van-tabbar>

Vant

我来解答赞 4 收藏

反馈

1 条解答

皇甫令敏 Lv1

这不是 Tabbar 的问题，是 Vue 组件复用机制导致的。

给 router-view 加上 key 强制刷新：

如果你的项目用了 keep-alive，需要排除对应的组件名：

你之前试的 :key="$route.fullPath" 没用，可能是写在了 Tabbar 上而不是 router-view 上，记住了要加在 router-view 那里。

2026-03-13 21:00