SwiftUI中如何在NavigationStack内管理多个Sheet？

当前代码中，FirstDetailView的Sheet绑定到自身的isPresented状态，当通过path.append导航到SecondDetailView时，FirstDetailView并未从NavigationStack的视图层级中移除（栈会保留之前的视图），因此它的Sheet会继续显示在SecondDetailView上方，再叠加SecondDetailView自己弹出的Sheet，导致Sheet混乱叠加的问题。

方案一：导航动作中主动关闭当前Sheet #

在FirstDetailView的导航按钮里，先关闭自身Sheet再执行导航：

Button("GoToSecond", action: {
    isPresented = false // 先关闭当前Sheet
    path.append("SecondDetail")
})

这种方式直接在触发导航的时机控制Sheet关闭，逻辑直观，适合单一导航场景。

方案二：利用视图生命周期自动关闭Sheet #

给FirstDetailView添加onDisappear修饰符，只要视图从屏幕上消失（不管是导航前进还是后退），就自动关闭Sheet：

struct FirstDetailView: View {
    @Binding var path: NavigationPath
    @State var isPresented = true

    var body: some View {
        VStack {
            Text("Hello First!")
            Button("GoToSecond", action: {
                path.append("SecondDetail")
            })
            Spacer()
                .frame(maxWidth: .infinity, maxHeight: .infinity)
                .background(.yellow)
        }
        .sheet(isPresented: $isPresented) {
            SheetDetailView(title: "First")
                .presentationDetents([.medium, .large])
                .presentationBackgroundInteraction(.enabled)
        }
        .onDisappear {
            isPresented = false // 视图消失时关闭Sheet
        }
    }
}

该方案更通用，能覆盖所有视图离开的场景，避免Sheet残留。

方案三：使用sheet(item:)管理Sheet（推荐） #

用可选类型绑定替代布尔值状态，通过可选值的nil状态精准控制Sheet的显示/关闭，同时避免布尔状态可能带来的不一致问题：

// 先给String扩展Identifiable协议（或自定义枚举更规范）
extension String: Identifiable {
    public var id: String { self }
}

// 修改FirstDetailView
struct FirstDetailView: View {
    @Binding var path: NavigationPath
    @State var sheetItem: String? = "First"

    var body: some View {
        VStack {
            Text("Hello First!")
            Button("GoToSecond", action: {
                sheetItem = nil // 关闭Sheet
                path.append("SecondDetail")
            })
            Spacer()
                .frame(maxWidth: .infinity, maxHeight: .infinity)
                .background(.yellow)
        }
        .sheet(item: $sheetItem) { item in
            SheetDetailView(title: item)
                .presentationDetents([.medium, .large])
                .presentationBackgroundInteraction(.enabled)
        }
    }
}

// 修改SecondDetailView
struct SecondDetailView: View {
    @State var sheetItem: String? = "Second"

    var body: some View {
        VStack {
            Text("Hello Second")
                .frame(maxWidth: .infinity, maxHeight: .infinity)
                .background(.green)
        }
        .sheet(item: $sheetItem) { item in
            SheetDetailView(title: item)
                .presentationDetents([.medium, .large])
                .interactiveDismissDisabled()
                .presentationBackgroundInteraction(.enabled)
        }
    }
}

这种方式符合SwiftUI状态管理的最佳实践，Sheet的生命周期完全由绑定的可选值控制，逻辑清晰且不易出错。

修改后，从FirstDetailView导航到SecondDetailView时，前者的Sheet会被关闭，后者的Sheet会独立弹出，每个视图的Sheet都能各自独立管理，不会出现叠加混乱的问题。

内容的提问来源于stack exchange，提问作者Reza Khonsari