Hacktoberfest 2026:维护者为十月标记出来的 issue,仍然开放、适合新手。 浏览 Hacktoberfest issue

Toggling tabBarHidden destroys the tab's SwiftUI identity, dismissing presented sheets

未关闭 适合新手
#593 0 条评论 0 个 reaction 已指派 0 人 在 GitHub 查看

维护者通常 2 天内回复

还没有人认领这个 Issue。

评估

难度
2/5
预计耗时
1-3 小时
新手友好度
75/100
Issue 类型
缺陷
描述清晰度
描述清楚
活跃度
活跃
技术栈
react-native, swift, typescript
领域
frontend, mobile

调研方向

问题出在 iOS Swift 代码中。查看 ios/TabViewImpl.swift 中第 537-553 行附近的 hideTabBar 函数。修复方法是更改条件逻辑,对 iOS 16+ 使用 self.toolbar(flag ? .hidden : .automatic, for: .tabBar) 以保留 SwiftUI 标识。使用提供的 SwiftUI 重现代码片段测试更改,以验证切换标志不再重置状态或关闭工作表。此更改应应用于调用该函数的 NewTabView.swift 和 LegacyTabView.swift 中。

由索引模型根据 Issue 内容生成。

描述

Before submitting a new issue
  • I tested using the latest version of the library (1.4.0 is both latest and what we ship)
  • I tested using a supported version of react native (0.86.3)
  • I checked for possible duplicate issues
Bug summary

Toggling tabBarHidden at runtime tears down the tab's content and rebuilds it. A sheet presented from inside that tab is dismissed, and any @State in the subtree is lost.

We hit this on the common pattern of hiding the tab bar while the keyboard is up: a user typing in a sheet raises the keyboard, the app sets tabBarHidden, and their sheet disappears mid-edit.

Cause. hideTabBar is a @ViewBuilder whose branch depends on flag:

// ios/TabViewImpl.swift:537-553 @ 1.4.0
@ViewBuilder
func hideTabBar(_ flag: Bool) -> some View {
  #if !os(macOS)
    if flag {
      if #available(iOS 16.0, tvOS 16.0, *) {
        self.toolbar(.hidden, for: .tabBar)
      } else {
        // We fallback to isHidden on UITabBar
        self
      }
    } else {
      self
    }
  #else
    self
  #endif
}

A @ViewBuilder if/else compiles to _ConditionalContent<A, B>. Flipping flag swaps which branch is taken, which changes the view's type, which changes its structural identity. SwiftUI answers an identity change by discarding the subtree and building a new one — taking @State and any anchored presentation with it.

flag is a JS-driven prop, so this happens at runtime rather than once at setup:

ios/TabView/NewTabView.swift:45      .hideTabBar(props.tabBarHidden)
ios/TabView/LegacyTabView.swift:33   .hideTabBar(props.tabBarHidden)
Suggested fix

Take one branch, decided by availability — which is constant at runtime — and let only the toolbar value depend on flag:

@ViewBuilder
func hideTabBar(_ flag: Bool) -> some View {
  #if !os(macOS)
    if #available(iOS 16.0, tvOS 16.0, *) {
      // Keep the tab content's SwiftUI identity when tab-bar visibility changes.
      // Switching between a modified view and `self` tears down presentations
      // anchored in that tab.
      self.toolbar(flag ? .hidden : .automatic, for: .tabBar)
    } else {
      // We fallback to isHidden on UITabBar.
      self
    }
  #else
    self
  #endif
}

.automatic is the documented default for a toolbar's visibility, so the flag == false case keeps its current behaviour while the view keeps its identity. The pre-iOS-16 fallback is unchanged and still cannot hide the bar this way; that branch is now chosen by availability alone, so it no longer participates in identity changes either.

This is the diff we currently carry as a patch:

   @ViewBuilder
   func hideTabBar(_ flag: Bool) -> some View {
     #if !os(macOS)
-      if flag {
-        if #available(iOS 16.0, tvOS 16.0, *) {
-          self.toolbar(.hidden, for: .tabBar)
-        } else {
-          // We fallback to isHidden on UITabBar
-          self
-        }
+      if #available(iOS 16.0, tvOS 16.0, *) {
+        // Keep the tab content's SwiftUI identity when keyboard visibility
+        // changes. Switching between a modified view and `self` tears down
+        // presentations anchored in that tab, including Expo UI sheets.
+        self.toolbar(flag ? .hidden : .automatic, for: .tabBar)
       } else {
+        // We fallback to isHidden on UITabBar.
         self
       }
     #else

Happy to open a PR.

Library version

1.4.0

Environment info
react-native: 0.86.3
expo: 57.0.20
react: 19.2.3
react-native-bottom-tabs: 1.4.0
platform: iOS (real device and simulator)
architecture: Fabric (New Architecture)
Steps to reproduce

The reproduction is pure SwiftUI — no React Native and no dependency on this library, which is what shows the cause is the @ViewBuilder branch rather than anything about the bridge, the props, or the app.

  1. Download IdentityRepro.swift from the gist below
  2. Drop it into an iOS app target, or open it in an Xcode Preview
  3. Increment both counters, and/or tap "present sheet" on either side
  4. Flip the tabBarHidden toggle

Expected: both columns keep their state.
Actual: the UPSTREAM column resets its counter to 0 and dismisses its sheet; the FIXED column keeps both.

The file defines hideTabBar_upstream (verbatim from TabViewImpl.swift) and hideTabBar_fixed (the suggestion above) side by side over identical subtrees.

iOS/tvOS only — .toolbar(_:for: .tabBar) is unavailable on macOS, which is why the library's own function is wrapped in #if !os(macOS).

Reproducible sample code

https://gist.github.com/pawarren/56cbb014c18150e67995bf6f11ff8168

主要语言
TypeScript
星标
1.5k
派生
108
平均合并
22 小时 36 分钟
30 天内合并 PR
10

环境准备

从这里开始

  1. 先读完整个 Issue,再读项目的贡献指南。
  2. 在 Issue 下留言说明你要接手 —— 这能避免两个人做同样的事。
  3. Fork 仓库,在一个分支上完成修改。
  4. 提交 Pull Request,并在描述里引用这个 Issue 编号。

callstack/react-native-bottom-tabs 的其他 Issue

查看 callstack/react-native-bottom-tabs 的全部 Issue

相似的 Issue

更多 TypeScript Issue

把新 issue 发到你的邮箱

精选适合新手参与的 GitHub issue 摘要。