Toggling tabBarHidden destroys the tab's SwiftUI identity, dismissing presented sheets
まだ誰も着手していません。
評価
- 難易度
- 2/5
- 見積もり時間
- 1〜3時間
- 初心者へのやさしさ
- 75/100
- issue の種類
- バグ
- 明瞭さ
- 明確に書かれている
- 活発さ
- 活発
- 技術スタック
- react-native, swift, typescript
調査の方向性
問題は iOS Swift コードにあります。ios/TabViewImpl.swift の 537-553 行目付近にある hideTabBar 関数を確認してください。修正方法は、条件付きロジックを変更して、iOS 16+ で SwiftUI のアイデンティティを保持するために self.toolbar(flag ? .hidden : .automatic, for: .tabBar) を使用することです。提供された SwiftUI 再現用 Gist を使用して変更をテストし、フラグの切り替えが状態をリセットしたりシートを閉じたりしなくなることを確認してください。この変更は、関数が呼び出されている 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
- 平均マージ
- 12時間 42分
- マージ済み PR(30日)
- 9
コントリビューションガイド
はじめの一歩
- issue を最後まで読み、次にプロジェクトのコントリビューションガイドを読みます。
- 着手することを issue にコメントします — 二人が同じ作業をするのを防げます。
- リポジトリをフォークし、ブランチを切って変更します。
- issue 番号を参照したプルリクエストを送ります。
callstack/react-native-bottom-tabs のほかの issue
-
難易度 2/5 1〜3時間 初心者へのやさしさ 75/100
-
難易度 4/5 3〜5日 初心者へのやさしさ 48/100
-
難易度 4/5 3〜5日 初心者へのやさしさ 68/100
callstack/react-native-bottom-tabs#591 · コメント 1 件 ·
-
難易度 4/5 3〜5日 初心者へのやさしさ 58/100
-
bug
難易度 4/5 3〜5日 初心者へのやさしさ 48/100
callstack/react-native-bottom-tabs の issue をすべて見る
似ている issue
-
難易度 2/5 1〜3時間 初心者へのやさしさ 75/100
vercel-labs/just-bash#464 ·
-
looksLikeSlug() is ASCII-only, so non-Latin entity slugs (e.g. Korean) skip exact match and collapse オープン
難易度 2/5 1〜3時間 初心者へのやさしさ 75/100
-
難易度 2/5 1〜3時間 初心者へのやさしさ 65/100
-
難易度 2/5 1〜3時間 初心者へのやさしさ 65/100
-
難易度 1/5 1時間未満 初心者へのやさしさ 90/100
TanStack/tanstack.com#1293 ·