SwiftUI中如何通过.onTapGesture实现ContentView视图切换？

你的代码主要存在三个问题：@EnvironmentObject使用方式错误、视图状态管理逻辑不规范、子视图无法直接访问父视图变量。以下是修正后的完整代码和说明：

核心修正思路 #

1. 用枚举定义所有页面类型，避免直接存储View实例，后续扩展更方便
2. 用ObservableObject管理导航状态，实现跨视图的状态同步
3. 正确注入和使用EnvironmentObject，让子视图能修改全局导航状态

修正后的完整代码 #

import SwiftUI

// 定义所有页面枚举
enum AppScreen {
    case home
    case question1
    // 后续可添加更多页面，比如question2、result等
}

// 导航状态管理器
class NavigationManager: ObservableObject {
    @Published var currentScreen: AppScreen = .home
}

struct ContentView: View {
    // 初始化导航管理器，@StateObject用于生命周期内保持实例
    @StateObject private var navigationManager = NavigationManager()
    
    var body: some View {
        // 根据当前屏幕状态切换视图
        Group {
            switch navigationManager.currentScreen {
            case .home:
                Home()
            case .question1:
                Question1()
            }
        }
        // 将导航管理器注入环境，子视图可通过@EnvironmentObject获取
        .environmentObject(navigationManager)
    }
}

struct Home: View {
    // 从环境中获取导航管理器
    @EnvironmentObject private var navigationManager: NavigationManager
    
    var body: some View {
        ZStack {
            Color(red: 115/255, green: 235/255, blue: 156/255)
                .edgesIgnoringSafeArea(.all)
            
            VStack(spacing: 40) {
                Text("The Ultimate Pet Chooser!")
                    .bold()
                    .font(.system(size: 50))
                    .fontWeight(.heavy)
                    .foregroundColor(Color(red: 77/255, green: 87/255, blue: 95/255))
                
                Rectangle()
                    .fill(Color(red: 130/255, green: 0/255, blue: 255/255))
                    .frame(width: 300, height: 250)
                    .onTapGesture {
                        // 修改导航状态，切换到Question1页面
                        navigationManager.currentScreen = .question1
                    }
                
                Text("Click here to start!")
                    .fontWeight(.heavy)
                    .font(.system(size: 50))
                    .bold()
                    .multilineTextAlignment(.center)
                    .foregroundColor(.white)
            }
        }
    }
}

struct Question1: View {
    var body: some View {
        Text("Hello")
            .font(.largeTitle)
            .fontWeight(.heavy)
    }
}

// 预览设置
struct ContentView_Previews: PreviewProvider {
    static var previews: some View {
        ContentView()
    }
}

struct Home_Previews: PreviewProvider {
    static var previews: some View {
        Home()
            .environmentObject(NavigationManager())
    }
}

struct Question1_Previews: PreviewProvider {
    static var previews: some View {
        Question1()
    }
}

关键修正点说明 #

• 枚举管理页面：AppScreen枚举清晰定义所有页面类型，后续加新页面只需新增枚举值，无需修改核心导航逻辑
• ObservableObject状态管理：NavigationManager中的@Published属性会自动通知视图刷新，确保状态变化实时同步
• EnvironmentObject正确用法：父视图用.environmentObject注入实例，子视图用@EnvironmentObject获取，实现跨视图状态共享
• 优化布局：移除了硬编码的position，改用VStack(spacing:)实现自适应布局，适配不同屏幕尺寸

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