SwiftUI模态视图嵌套问题：如何让View2以新栈形式呈现

我有三个视图：ContentView()、View1()、View2()。ContentView作为主视图嵌入在NavigationView中，通过按钮的.sheet()模态打开View1()。View1必须嵌入独立的NavigationView，否则NavigationLink无法正常工作。

目前的问题是：点击View1里的NavigationLink，View2()是以新模态弹出，而不是我想要的在View1的导航栈中Push呈现。

现有代码 #

import SwiftUI

struct ContentView: View {
    @State private var isPresentingView1 = false

    var body: some View {
        NavigationView {
            VStack {
                Button("打开View1（模态）") {
                    isPresentingView1.toggle()
                }
                .sheet(isPresented: $isPresentingView1) {
                        View1()
                }
            }
        }
    }
}

struct View1: View {
    var body: some View {
        NavigationView{
            NavigationLink("打开View2", destination: View2())
                .navigationBarTitle("View 1")
        }
    }
}

struct View2: View {
    var body: some View {
        VStack {
            Text("View 2 内容")
            Spacer()
        }
    }
}

struct ContentView_Previews: PreviewProvider {
    static var previews: some View {
        ContentView()
    }
}

解决方案 #

iOS 16+ 推荐方案：用NavigationStack替代NavigationView

iOS 16开始，Apple推出了NavigationStack替代旧的NavigationView，它对模态内的导航栈支持更稳定，能直接解决这个问题：

import SwiftUI

struct ContentView: View {
    @State private var isPresentingView1 = false

    var body: some View {
        NavigationStack {
            VStack {
                Button("打开View1（模态）") {
                    isPresentingView1.toggle()
                }
                .sheet(isPresented: $isPresentingView1) {
                        View1()
                }
            }
        }
    }
}

struct View1: View {
    var body: some View {
        NavigationStack{
            NavigationLink("打开View2", destination: View2())
                .navigationTitle("View 1")
        }
    }
}

struct View2: View {
    var body: some View {
        VStack {
            Text("View 2 内容")
            Spacer()
        }
        .navigationTitle("View 2")
    }
}

iOS 15及以下兼容方案

如果需要兼容旧系统，问题出在NavigationView对模态内导航上下文的识别异常。可以通过以下两种方式修复：

1. 用容器视图包裹NavigationLink
   把NavigationLink放在List或ScrollView这类容器里，让NavigationView正确识别栈Push意图：

struct View1: View {
    var body: some View {
        NavigationView{
            List {
                NavigationLink("打开View2", destination: View2())
            }
            .navigationBarTitle("View 1")
        }
    }
}

2. 指定NavigationLink样式
   手动设置导航样式为栈模式：

struct View1: View {
    var body: some View {
        NavigationView{
            NavigationLink("打开View2", destination: View2())
                .navigationBarTitle("View 1")
                .navigationStyle(.stack)
        }
    }
}

原理说明 #

旧版NavigationView在模态环境中，偶尔会错误地将NavigationLink的行为识别为模态弹出而非栈Push。NavigationStack重新设计了导航上下文管理，彻底避免了这个问题；兼容方案则通过容器或显式样式，引导NavigationView正确处理导航动作。

内容的提问来源于stack exchange，提问作者Uday Agarwal