為什么使用 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!")
                    }
                }
        }
    }
}