SwiftUI：使用 NavigationView 会导致图像和文本消失

Question

我要做的是.. 如果我单击一个菜单，它会转到详细的菜单描述页面。

不过好像有点不对劲。代码如下。

[contentview.swift]

var body: some View {
        VStack(alignment:.leading){
            List{
                Text("Menu")
                    .font(.title)
                    .fontWeight(.heavy)
                ForEach(menu){ section in
                    Section(header: Text(section.name) , content: {
                        ForEach(section.items.indices)
                        {
                            index in ItemRow(item:section.items[index])
                        }
                    })
                }
            }.listStyle(GroupedListStyle())
        }
    }

[ItemRow.swift]

struct ItemRow: View {
    let item: MenuItem
    var body: some View {
        VStack{
            //NavigationView{
                NavigationLink(destination: ItemDetail(item:item)) {
                    HStack{
                        Image(item.thumbnailImage)
                        VStack(alignment:.leading){
                            Text(item.name)
                                .font(.headline)
                            Text("$\(item.price)")
                        }
                    }
                }
            //}
        }
    }
}

我特意把'NaviagationView'注释掉了。因为如果我激活与 NavigationNiew 相关的评论..

看到了吗？看起来很奇怪。我仍然想知道我做错了什么.. 在添加导航代码之前，菜单显示在预览井上。你能给我一些提示吗？

=================================
我的问题已经解决了！

[ContentView.swift]

struct ContentView: View {
    var body: some View {
            ItemList()
    }
}

[ItemList.swift]

struct ItemList: View {
    var body: some View {
        NavigationView{
            VStack(alignment:.leading){
                List{
                    Text("Menu")
                        .font(.title)
                        .fontWeight(.heavy)
                    ForEach(menu){ section in
                        Section(header: Text(section.name) , content: {
                            ForEach(section.items.indices)
                            {
                                index in
                                //ItemRow(item:section.items[index])
                                
                                NavigationLink(destination: ItemDetail(item:section.items[index])) {
                                    HStack{
                                        Image(section.items[index].thumbnailImage)
                                        VStack(alignment:.leading){
                                            Text(section.items[index].name)
                                                .font(.headline)
                                            Text("$\(section.items[index].price)")
                                        }
                                    }
                                }
                                
                            }
                        })
                    }
                }.listStyle(GroupedListStyle())
            }
        }
    }
}

Answer 1

一个应用中通常只有一个NavigationView。通常是最外层View.

在这种情况下，将其放在 ContentView 中的 VStack 之上。

最常见的例外之一是工作表。

SwiftUI：使用 NavigationView 会导致图像和文本消失

SwiftUI : Using NavigationView leads to image and text gone

xcode

swift

navigationview

swiftui