iOS下使用SwiftUI实现启动默认显示详情页及返回账户列表功能

直接上可运行的完整代码，完全匹配你要的iOS邮件App式交互：

import SwiftUI

// 定义账户模型，需遵循Identifiable以便导航
struct Account: Identifiable {
    let id = UUID()
    let name: String
    let email: String
}

struct ContentView: View {
    // 模拟账户数据
    let accounts: [Account] = [
        Account(name: "张三", email: "zhangsan@example.com"),
        Account(name: "李四", email: "lisi@example.com")
    ]
    // 绑定导航栈路径
    @State private var navigationPath: [Account] = []
    
    var body: some View {
        NavigationStack(path: $navigationPath) {
            // 账户列表页作为栈底页面
            AccountListView(accounts: accounts) { account in
                navigationPath.append(account)
            }
            // 配置详情页的导航目标
            .navigationDestination(for: Account.self) { account in
                AccountDetailView(account: account)
            }
        }
        // 启动时自动将第一个账户压入导航栈，直接显示详情页
        .onAppear {
            if let firstAccount = accounts.first {
                navigationPath.append(firstAccount)
            }
        }
    }
}

// 账户列表页
struct AccountListView: View {
    let accounts: [Account]
    let selectAccount: (Account) -> Void
    
    var body: some View {
        List(accounts) { account in
            Button(action: { selectAccount(account) }) {
                VStack(alignment: .leading) {
                    Text(account.name)
                        .font(.headline)
                    Text(account.email)
                        .font(.subheadline)
                        .foregroundColor(.secondary)
                }
            }
        }
        .navigationTitle("账户列表")
    }
}

// 账户详情页
struct AccountDetailView: View {
    let account: Account
    
    var body: some View {
        VStack(alignment: .leading, spacing: 20) {
            Text("账户详情")
                .font(.largeTitle)
                .fontWeight(.bold)
            Text("姓名: \(account.name)")
            Text("邮箱: \(account.email)")
            Spacer()
        }
        .padding()
        .navigationTitle(account.name)
        // 无需手动添加返回按钮，NavigationStack会自动生成
    }
}

#Preview {
    ContentView()
}

核心逻辑说明 #

• 启动直接进详情页：通过onAppear将默认要显示的账户实例添加到navigationPath，NavigationStack会自动完成导航，同时保留栈底的列表页。
• 原生返回按钮：系统会根据栈层级自动生成返回按钮，点击后会从navigationPath移除顶部元素，回到列表页，完全和iOS邮件App的交互一致。
• 保持代码简洁：不需要自定义返回按钮逻辑，依赖NavigationStack的原生行为即可保证交互的一致性和稳定性。

内容的提问来源于stack exchange，提问作者Azhagusundaram Tamil