Toggling tabBarHidden destroys the tab's SwiftUI identity, dismissing presented sheets
维护者通常 2 天内回复
还没有人认领这个 Issue。
评估
- 难度
- 2/5
- 预计耗时
- 1-3 小时
- 新手友好度
- 75/100
- Issue 类型
- 缺陷
- 描述清晰度
- 描述清楚
- 活跃度
- 活跃
- 技术栈
- react-native, swift, typescript
调研方向
问题出在 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
latestand 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.
- Download
IdentityRepro.swiftfrom the gist below - Drop it into an iOS app target, or open it in an Xcode Preview
- Increment both counters, and/or tap "present sheet" on either side
- Flip the
tabBarHiddentoggle
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
环境准备
从这里开始
- 先读完整个 Issue,再读项目的贡献指南。
- 在 Issue 下留言说明你要接手 —— 这能避免两个人做同样的事。
- Fork 仓库,在一个分支上完成修改。
- 提交 Pull Request,并在描述里引用这个 Issue 编号。
callstack/react-native-bottom-tabs 的其他 Issue
-
难度 2/5 1-3 小时 新手友好度 75/100
callstack/react-native-bottom-tabs#560 ·
维护者通常 2 天内回复
-
难度 4/5 3-5 天 新手友好度 48/100
callstack/react-native-bottom-tabs#592 ·
维护者通常 2 天内回复
-
难度 4/5 3-5 天 新手友好度 68/100
callstack/react-native-bottom-tabs#591 · 1 条评论 ·
维护者通常 2 天内回复
-
难度 4/5 3-5 天 新手友好度 58/100
callstack/react-native-bottom-tabs#590 ·
维护者通常 2 天内回复
-
bug
难度 4/5 3-5 天 新手友好度 48/100
callstack/react-native-bottom-tabs#573 ·
维护者通常 2 天内回复
查看 callstack/react-native-bottom-tabs 的全部 Issue
相似的 Issue
-
bug
难度 1/5 1 小时以内 新手友好度 88/100
StabilityNexus/Fate-EVM-Frontend#153 ·
维护者通常 1 天内回复
-
难度 2/5 1-3 小时 新手友好度 78/100
code-yeongyu/oh-my-openagent#9039 ·
维护者通常 1 天内回复
-
bug
难度 2/5 1-3 小时 新手友好度 84/100
Tencent/teamai-cli#862 ·
维护者通常 1 天内回复
-
bug good first issue hacktoberfest redis
难度 2/5 1-3 小时 新手友好度 88/100
libredb/libredb-studio#1164 ·
维护者通常 1 天内回复
-
flake
难度 2/5 1-3 小时 新手友好度 85/100
维护者通常 1 天内回复