为什么使用 SwiftUI 不显示导航标题？

Question

我正在使用苹果官方教程学习SwiftUI ： https ://developer.apple.com/tutorials/swiftui/building-lists-and-navigation

一切正常，直到我尝试通过调用.navigationBarTitle在NavigationView上显示导航标题。

我试图刷新实时视图，重新启动 Xcode，但它仍然没有出现。

这是我的代码：

import SwiftUI

struct LandmarkList : View {
    var body: some View {
        NavigationView {
            List(landmarkData) { landmark in
                LandmarkRow(landmark: landmark)
            }
        }
        .navigationBarItem(title: Text("Done"))
        .navigationBarTitle(Text("Landmarks"))
    }
}

#if DEBUG
struct LandmarkList_Previews : PreviewProvider {
    static var previews: some View {
        LandmarkList()
    }
}
#endif

Xcode 看起来像这样：

根据教程，它应该显示导航标题，但在我的情况下没有。

知道为什么吗？ 谢谢！

Answer 1

.navigationBarTitle()和.navigationBarItem()是NavigationView内部View的修饰符，而不是NavigationView本身：

struct LandmarkList: View {
    var body: some View {
        NavigationView {
            List(landmarkData) { landmark in
                LandmarkRow(landmark: landmark)
            }
            .navigationBarItem(title: Text("Done"))
            .navigationBarTitle(Text("Landmarks"))
        }
    }
}

如果你仔细想想，这是有道理的。 随着NavigationView中的View发生变化，新的View决定了导航栏的标题和内容应该是什么。

Answer 2

描述：

NavigationView只是围绕某些内容的容器。 当您从一个页面导航到另一个页面时，内容会发生变化，但NavigationView仍然存在。

关键是NavigationView在显示每个view时会显示它的内容。 所以它将与目的地封装在一起。

最后，您应该在导航内（在内容上）添加所有导航修饰符

---

例子：

struct Content: View {
    var body: some View {
        Text("Some. content")
            .navigationBarItem(title: Text("Done"))
            .navigationBarTitle(Text("Landmarks"))
    }
}

struct Parent: View {
    var body: some View {
        NavigationView {
            Content() // This contains navigation modifiers inside the view itself
        }
    }
}

Answer 3

如果有人正在寻找带有标签按钮的导航标题，此代码可能会有所帮助 -

struct ContentView: View {
    var body: some View {
        NavigationView {
            Text("SwiftUI")
                .navigationTitle("Screen Title")
                .toolbar {
                    Button("Right") {
                        print("Right button tapped!")
                    }
                }
        }
    }
}