SwiftUI导航Bug：iOS14/15跳转新页面时回退多视图后页面异常

问题描述 #

导航路径为 [Login view] -> [register view step 1] -> [register view step 2]，需要回退所有注册视图并跳转至验证视图，预期最终路径为 [Login view] -> [verification view]。但在iOS14、15中执行操作后，注册视图被回退，验证视图被推入后立即弹出，最终停留在Login view。

问题原因 #

原实现使用多个独立的@Published布尔值控制导航状态，在同一操作中同时修改多个状态变量时，iOS14/15的NavigationView会出现状态更新竞态，导致导航栈的处理逻辑混乱，引发视图异常弹出。

解决方案 #

改用单一枚举类型管理导航状态，确保同一时间只有一个导航状态生效，避免多状态变量同步修改带来的冲突。

步骤1：定义导航状态枚举 #

enum NavigationState {
    case login
    case registerStep1
    case registerStep2
    case verification
}

步骤2：重构状态管理器 #

将多个布尔值替换为单一的导航状态变量：

class StateManager: ObservableObject {
    @Published var currentState: NavigationState = .login
}

步骤3：修改视图导航逻辑 #

LoginView

struct LoginView: View {
    @EnvironmentObject var stateManager: StateManager
    
    var body: some View {
        VStack {
            Text("Login").font(.title)
            
            NavigationLink(
                destination: Register1View(),
                isActive: Binding(
                    get: { stateManager.currentState == .registerStep1 },
                    set: { if !$0 { stateManager.currentState = .login } }
                )
            ) {
                Text("Navigate to Register")
            }
        }
    }
}

Register1View

struct Register1View: View {
    @EnvironmentObject var stateManager: StateManager
    
    var body: some View {
        VStack {
            Text("Register 1").font(.title)
            
            NavigationLink(
                destination: Register2View(),
                isActive: Binding(
                    get: { stateManager.currentState == .registerStep2 },
                    set: { if !$0 { stateManager.currentState = .registerStep1 } }
                )
            ) {
                Text("Navigate to Register 2")
            }
        }
    }
}

Register2View

添加隐藏的NavigationLink绑定到验证视图，点击按钮时直接切换导航状态：

struct Register2View: View {
    @EnvironmentObject var stateManager: StateManager
    
    var body: some View {
        VStack {
            Text("Register 2").font(.title)
            
            Button(action: {
                stateManager.currentState = .verification
            }) {
                Text("Navigate to Verification view")
            }
            
            // 隐藏的NavigationLink用于触发验证视图跳转
            NavigationLink(
                destination: VerificationView(),
                isActive: Binding(
                    get: { stateManager.currentState == .verification },
                    set: { if !$0 { stateManager.currentState = .login } }
                )
            ) {
                EmptyView()
            }
            .hidden()
        }
    }
}

VerificationView示例

struct VerificationView: View {
    @EnvironmentObject var stateManager: StateManager
    
    var body: some View {
        VStack {
            Text("Verification").font(.title)
            
            Button(action: {
                stateManager.currentState = .login
            }) {
                Text("Back to Login")
            }
        }
    }
}

原理说明 #

单一状态枚举确保导航状态的唯一性，避免多变量同步修改导致的状态冲突。通过Binding将NavigationLink的激活状态与当前导航状态关联，让NavigationView能按正确时序处理导航栈的更新，解决iOS14/15中的视图异常弹出问题。

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