TabView Swift UI 中的 NavigationView

Question

我在长时间休息后刚刚拿起 SwiftUI，但我不明白为什么我不能将 aNavigation View放在Tab View.

我希望我的视图Navigation View成为.tabItem主应用程序导航的一部分，所以我正在尝试这样做：

struct ContentView: View {
    var body: some View {
            TabView {
            
        NavigationView {
            
            .tabItem {
                Text("Home")
            }
                    
            Text("Tab bar test")
                .navigationBarTitle("Page One")
        }
}

这不适用于错误消息

Cannot infer contextual base in reference to member 'tabItem'

但是当我尝试这个时

    var body: some View {
        TabView {
        
    NavigationView {
                
        Text("Tab bar test")
            .navigationBarTitle("Page One")
    }
}
    .tabItem {
        Image(systemName: "1.circle")
        Text("Home")
    }
}

它构建得很好，但标签栏不显示。

我希望对其他人有用的主要问题是......

为什么我不能通过直接Navigation View嵌套在标签栏项目中.tabItemNavigation View中（按照我的第一个示例）？

我认为这是一个与此类似的问题，但那里没有代码。然后与这个非常相似，但他们似乎.tabItem直接使用ContentView像我想要的那样NavigationView使用，但这不是构建！？

我可能误解了一些简单的事情，但目前我根本不明白。

Answer 1

这样做是为了更好地概览：

内容查看：

struct ContentView : View {
        var body: some View {
            TabView {

            FirstView()
                .tabItem { 
                    Image(systemName: "folder.fill")
                    Text("Home")
                }

            SecondView()
                .tabItem { 
                    Image(systemName: "folder.fill")
                    Text("SecondView")
                }

                
            }
        }
    }

• 第一视角

  struct FirstView: View {
                  var body: some View {
  
                      NavigationView {
                              Text("FirstView")
                                  .navigationBarTitle("Home")
                          }
  
                      }
                  }
              }
  

• 第二视角

     struct SecondView: View {
        var body: some View {
  
            NavigationView {
                    Text("SecondView")
                        .navigationBarTitle("Home")
                }
  
            }
        }
    }
  

Answer 2

.tabItem应该用作代表该选项卡的视图的修饰符。

在第一个示例中，由于语法错误，这不起作用 - 您试图在 中的闭包的开头使用它NavigationView {，而实际上您希望将它放在右大括号的外部：NavigationView { }.tabItem(...)

在第二个示例中，您将用作.tabItem整个而 TabView不是NavigationView.

如果您缩进代码以便可以看到层次结构，那么您的两个示例可能会更清楚地揭示发生的情况。尝试在 Xcode 中选择您的代码并使用 Ctrl-I 让 Xcode 为您正确格式化它。

这是一个工作版本：

struct ContentView : View {
    var body: some View {
        TabView {
            NavigationView {
                Text("Tab bar test")
                    .navigationBarTitle("Page One")
            }
            .tabItem { //note how this is modifying `NavigationView`
                Image(systemName: "1.circle")
                Text("Home")
            }
            
        }
    }
}