SwiftUI中如何通过触摸手势切换视图？新手实现视图跳转遇阻

首先你代码里的onTapGesture语法有问题，不需要写action:{}，直接把逻辑放在闭包里就行。

SwiftUI里实现视图切换主要有两种常用方式，根据你的需求选择：

方案1：使用NavigationStack（iOS 16+，推荐用于层级页面跳转） #

这种方式适合常规的页面导航，用户可以通过系统返回键回到欢迎页，也能实现视图间的完全隔离。

修改后的完整代码：

import SwiftUI

struct ContentView: View {
    // 管理导航路径，控制页面跳转逻辑
    @State private var navigationPath = NavigationPath()
    
    var body: some View {
        NavigationStack(path: $navigationPath) {
            VStack {
                Image(systemName: "globe")
                    .imageScale(.large)
                    .foregroundColor(.accentColor)
                Text("Welcome to WOD planner!")
                    .font(.title)
                    .multilineTextAlignment(.center)
                    .onTapGesture {
                        // 将标记值加入导航路径，触发跳转
                        navigationPath.append("questionPage")
                    }
            }
            .padding()
            // 绑定导航目标：匹配到标记值时展示QuestionPage
            .navigationDestination(for: String.self) { value in
                if value == "questionPage" {
                    QuestionPage()
                }
            }
        }
    }
}

// 你的QuestionPage视图（示例结构，替换成你已创建的代码）
struct QuestionPage: View {
    var body: some View {
        VStack {
            Text("问题页面")
            // 这里添加你的下拉问题框逻辑
        }
        .navigationTitle("问题页")
    }
}

方案2：使用模态视图（Sheet，适合弹出式页面） #

如果希望QuestionPage以弹窗形式展示，用这种方式更合适，同样能实现视图隔离：

import SwiftUI

struct ContentView: View {
    // 控制模态视图的显示/隐藏状态
    @State private var isQuestionPageShown = false
    
    var body: some View {
        VStack {
            Image(systemName: "globe")
                .imageScale(.large)
                .foregroundColor(.accentColor)
            Text("Welcome to WOD planner!")
                .font(.title)
                .multilineTextAlignment(.center)
                .onTapGesture {
                    // 切换状态，触发模态视图展示
                    isQuestionPageShown.toggle()
                }
        }
        .padding()
        // 绑定模态视图：状态为true时展示QuestionPage
        .sheet(isPresented: $isQuestionPageShown) {
            QuestionPage()
        }
    }
}

struct QuestionPage: View {
    var body: some View {
        VStack {
            Text("问题页面")
            // 下拉问题框逻辑
        }
    }
}

两种方案里，ContentView和QuestionPage都是独立的View结构体，各自管理自身的状态与UI逻辑，天然实现了视图隔离。

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