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

【问题标题】：SwiftUI : Using NavigationView leads to image and text goneSwiftUI：使用 NavigationView 导致图像和文本消失
【发布时间】：2021-09-19 03:12:37
【问题描述】：

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

但似乎有些不对劲。代码如下。

[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)")
                        }
                    }
                }
            //}
        }
    }
}

我故意注释掉了“导航视图”。因为如果我激活与 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())
            }
        }
    }
}

【问题讨论】：

一定要删除ItemRow里面的NavigationView。这就是后退按钮的来源。
试着把NavigationLink放在ItemRow外面而不是里面
谢谢..我已经很努力了..我会尽快上传我所做的..

标签： swift xcode swiftui navigationview

【解决方案1】：

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

在这种情况下，将它放在ContentView 中的VStack 上方。

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

【讨论】：