SwiftUI如何实现点击按钮跳转视图 点击connexionBtnView跳转AdminView/UserView

实现思路 #

使用SwiftUI的编程式导航能力，点击按钮时先完成登录校验、判断用户角色，再根据角色触发对应页面的跳转，无需编写多个硬编码的NavigationLink。 #

iOS 16+ 推荐实现（使用NavigationStack） #

第一步：添加需要的状态变量 #

在ConnexionView中新增两个状态属性：

// 控制导航是否触发
@State private var jumpToTargetView = false
// 存储登录后用户角色，true为管理员，false为普通用户
@State private var isAdminUser = false

第二步：替换NavigationView为NavigationStack，添加导航目标绑定 #

把原来的NavigationView替换成NavigationStack，并添加navigationDestination修饰符绑定跳转目标：

NavigationStack {
    // 原有ZStack内容不变
    ZStack{
        Image("background")
            .ignoresSafeArea()
        // 原有VStack内容不变
        VStack (spacing: 15){
            // 所有原有子视图保持不变
            Spacer()
            logoView
            Spacer()
            titleView
            loginIdView
            loginPwdView
            connexionBtnView 
            Spacer()
            NavigationLink {
                LostPwdView()
            } label: {
                lostPwd
            }
            Spacer()
        }.frame(maxHeight: .infinity)
            .padding(.bottom,keyboardHander.keyboardHeight)
            .animation(.default)
    }
    // 新增：绑定跳转目标
    .navigationDestination(isPresented: $jumpToTargetView) {
        if isAdminUser {
            AdminView()
        } else {
            UserView()
        }
    }
}

第三步：给connexionBtnView添加点击逻辑 #

给connexionBtnView添加onTapGesture或者按钮的action事件，处理登录校验和角色判断：

// 假设connexionBtnView为Button类型，直接在action中编写逻辑即可
var connexionBtnView: some View {
    Button("登录") {
        // 此处编写登录校验逻辑，可对接接口或本地判断账号密码
        // 示例：如果账号为admin则判定为管理员
        if loginId == "admin" && pwd == "admin123" {
            isAdminUser = true
        } else {
            isAdminUser = false
        }
        // 触发导航跳转
        jumpToTargetView = true
    }
}

兼容iOS 15及更早版本实现 #

如果需要支持旧版本，用NavigationView+带isActive绑定的NavigationLink实现，把导航链接放在VStack最下方即可：

NavigationView {
    ZStack{
        Image("background")
            .ignoresSafeArea()
        VStack (spacing: 15){
            // 原有所有子视图保持不变
            Spacer()
            logoView
            Spacer()
            titleView
            loginIdView
            loginPwdView
            connexionBtnView 
            Spacer()
            NavigationLink {
                LostPwdView()
            } label: {
                lostPwd
            }
            // 新增：隐藏的条件跳转NavigationLink
            NavigationLink(isActive: $jumpToTargetView) {
                if isAdminUser {
                    AdminView()
                } else {
                    UserView()
                }
            } label: {
                EmptyView()
            }
            Spacer()
        }.frame(maxHeight: .infinity)
            .padding(.bottom,keyboardHander.keyboardHeight)
            .animation(.default)
    }
}

点击逻辑和iOS16+版本完全一致，无需改动。

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